@pie-element/extended-text-entry 13.3.3-next.10 → 13.3.3-next.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/configure/package.json +2 -2
- package/controller/package.json +1 -1
- package/lib/main.js +0 -6
- package/lib/main.js.map +1 -1
- package/module/configure.js +1 -1
- package/module/element.js +1 -1
- package/module/manifest.json +4 -4
- package/module/print.js +1 -1
- package/package.json +6 -6
package/configure/package.json
CHANGED
|
@@ -10,8 +10,8 @@
|
|
|
10
10
|
"dependencies": {
|
|
11
11
|
"@material-ui/core": "^3.9.2",
|
|
12
12
|
"@pie-framework/pie-configure-events": "^1.3.0",
|
|
13
|
-
"@pie-lib/config-ui": "11.30.
|
|
14
|
-
"@pie-lib/editable-html": "11.21.
|
|
13
|
+
"@pie-lib/config-ui": "^11.30.1",
|
|
14
|
+
"@pie-lib/editable-html": "^11.21.1",
|
|
15
15
|
"lodash": "^4.17.15",
|
|
16
16
|
"prop-types": "^15.6.2",
|
|
17
17
|
"react": "^16.8.1",
|
package/controller/package.json
CHANGED
package/lib/main.js
CHANGED
|
@@ -228,12 +228,6 @@ var Main = /*#__PURE__*/function (_React$Component) {
|
|
|
228
228
|
},
|
|
229
229
|
separateParagraphs: {
|
|
230
230
|
disabled: false
|
|
231
|
-
},
|
|
232
|
-
ul_list: {
|
|
233
|
-
disabled: true
|
|
234
|
-
},
|
|
235
|
-
ol_list: {
|
|
236
|
-
disabled: true
|
|
237
231
|
}
|
|
238
232
|
},
|
|
239
233
|
languageCharactersProps: languageCharactersProps
|
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","teacherInstructions","editor","borderRadius","srOnly","position","left","top","height","overflow","Main","props","onValueChange","onCommentChange","model","classes","session","onAnnotationsChange","animationsDisabled","annotatorMode","customKeys","dimensions","disabled","disabledAnnotator","equationEditor","extraCSSRules","feedback","mathInput","playersToolbarPosition","predefinedAnnotations","spanishInput","specialInput","spellCheckEnabled","annotations","comment","value","maxHeight","toolbarOpts","teacherInstructionsDiv","languageCharactersProps","push","language","ref","containerRef","hidden","visible","collapsible","changeSessionComment","changeSessionValue","toString","math","keypadMode","controlledKeypadMode","video","audio","table","textAlign","separateParagraphs","ul_list","ol_list","React","Component","PropTypes","func","isRequired","object","shape","string","array"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport debounce from 'lodash/debounce';\nimport debug from 'debug';\n\nimport Typography from '@material-ui/core/Typography';\nimport { withStyles } from '@material-ui/core/styles';\n\nimport EditableHtml from '@pie-lib/editable-html';\nimport { color, Feedback, Collapsible, PreviewPrompt, UiLayout } from '@pie-lib/render-ui';\n\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 teacherInstructions: {\n marginBottom: theme.spacing.unit * 2,\n },\n editor: {\n marginBottom: theme.spacing.unit * 2,\n borderRadius: '4px',\n },\n srOnly: {\n position: 'absolute',\n left: '-10000px',\n top: 'auto',\n width: '1px',\n height: '1px',\n overflow: 'hidden',\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 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 extraCSSRules,\n feedback,\n mathInput,\n playersToolbarPosition,\n predefinedAnnotations,\n prompt,\n spanishInput,\n specialInput,\n spellCheckEnabled,\n teacherInstructions,\n } = model;\n const { annotations, comment, value } = session;\n const { width, height } = dimensions || {};\n const maxHeight = '40vh';\n const toolbarOpts = { position: playersToolbarPosition === 'top' ? 'top' : 'bottom' };\n\n log('[render] disabled? ', disabled);\n\n const teacherInstructionsDiv = (\n <PreviewPrompt defaultClassName=\"teacher-instructions\" prompt={teacherInstructions} />\n );\n\n const languageCharactersProps = [];\n\n if (spanishInput) {\n languageCharactersProps.push({ language: 'spanish' });\n }\n\n if (specialInput) {\n languageCharactersProps.push({ language: 'special' });\n }\n\n return (\n <UiLayout\n extraCSSRules={extraCSSRules}\n className={classes.main}\n ref={(ref) => {\n this.containerRef = ref;\n }}\n >\n <h2 className={classes.srOnly}>Constructed Response Question</h2>\n\n {teacherInstructions && (\n <div className={classes.teacherInstructions}>\n {!animationsDisabled ? (\n <Collapsible\n labels={{ hidden: 'Show Teacher Instructions', visible: 'Hide Teacher Instructions' }}\n className={classes.collapsible}\n >\n {teacherInstructionsDiv}\n </Collapsible>\n ) : (\n teacherInstructionsDiv\n )}\n </div>\n )}\n\n {prompt && (\n <Typography component={'span'} className={classes.prompt}>\n <PreviewPrompt defaultClassName=\"prompt\" prompt={model.prompt} />\n </Typography>\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 className={classnames(classes.editor, 'response-area-editor')}\n onChange={this.changeSessionValue}\n markup={value || ''}\n maxWidth={width && width.toString()}\n minWidth={'100px'}\n minHeight={height && height.toString()}\n maxHeight={maxHeight}\n disabled={disabled}\n highlightShape={true}\n toolbarOpts={toolbarOpts}\n spellCheck={spellCheckEnabled}\n charactersLimit={50000}\n autoWidthToolbar\n pluginProps={{\n math: {\n disabled: !mathInput,\n customKeys: this.props.model.customKeys,\n keypadMode: this.props.model.equationEditor,\n controlledKeypadMode: false,\n },\n video: {\n disabled: true,\n },\n audio: {\n disabled: true,\n },\n table: {\n disabled: true,\n },\n textAlign: {\n disabled: true,\n },\n separateParagraphs: { disabled: false },\n ul_list: { disabled: true },\n ol_list: { disabled: true },\n }}\n languageCharactersProps={languageCharactersProps}\n />\n )}\n\n {feedback && <Feedback correctness=\"correct\" feedback={feedback} />}\n </UiLayout>\n );\n }\n}\n\nexport default withStyles(style)(Main);\n"],"file":"main.js"}
|
|
1
|
+
{"version":3,"sources":["../src/main.jsx"],"names":["log","style","theme","main","backgroundColor","color","background","text","prompt","width","marginBottom","spacing","unit","fontSize","teacherInstructions","editor","borderRadius","srOnly","position","left","top","height","overflow","Main","props","onValueChange","onCommentChange","model","classes","session","onAnnotationsChange","animationsDisabled","annotatorMode","customKeys","dimensions","disabled","disabledAnnotator","equationEditor","extraCSSRules","feedback","mathInput","playersToolbarPosition","predefinedAnnotations","spanishInput","specialInput","spellCheckEnabled","annotations","comment","value","maxHeight","toolbarOpts","teacherInstructionsDiv","languageCharactersProps","push","language","ref","containerRef","hidden","visible","collapsible","changeSessionComment","changeSessionValue","toString","math","keypadMode","controlledKeypadMode","video","audio","table","textAlign","separateParagraphs","React","Component","PropTypes","func","isRequired","object","shape","string","array"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport debounce from 'lodash/debounce';\nimport debug from 'debug';\n\nimport Typography from '@material-ui/core/Typography';\nimport { withStyles } from '@material-ui/core/styles';\n\nimport EditableHtml from '@pie-lib/editable-html';\nimport { color, Feedback, Collapsible, PreviewPrompt, UiLayout } from '@pie-lib/render-ui';\n\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 teacherInstructions: {\n marginBottom: theme.spacing.unit * 2,\n },\n editor: {\n marginBottom: theme.spacing.unit * 2,\n borderRadius: '4px',\n },\n srOnly: {\n position: 'absolute',\n left: '-10000px',\n top: 'auto',\n width: '1px',\n height: '1px',\n overflow: 'hidden',\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 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 extraCSSRules,\n feedback,\n mathInput,\n playersToolbarPosition,\n predefinedAnnotations,\n prompt,\n spanishInput,\n specialInput,\n spellCheckEnabled,\n teacherInstructions,\n } = model;\n const { annotations, comment, value } = session;\n const { width, height } = dimensions || {};\n const maxHeight = '40vh';\n const toolbarOpts = { position: playersToolbarPosition === 'top' ? 'top' : 'bottom' };\n\n log('[render] disabled? ', disabled);\n\n const teacherInstructionsDiv = (\n <PreviewPrompt defaultClassName=\"teacher-instructions\" prompt={teacherInstructions} />\n );\n\n const languageCharactersProps = [];\n\n if (spanishInput) {\n languageCharactersProps.push({ language: 'spanish' });\n }\n\n if (specialInput) {\n languageCharactersProps.push({ language: 'special' });\n }\n\n return (\n <UiLayout\n extraCSSRules={extraCSSRules}\n className={classes.main}\n ref={(ref) => {\n this.containerRef = ref;\n }}\n >\n <h2 className={classes.srOnly}>Constructed Response Question</h2>\n\n {teacherInstructions && (\n <div className={classes.teacherInstructions}>\n {!animationsDisabled ? (\n <Collapsible\n labels={{ hidden: 'Show Teacher Instructions', visible: 'Hide Teacher Instructions' }}\n className={classes.collapsible}\n >\n {teacherInstructionsDiv}\n </Collapsible>\n ) : (\n teacherInstructionsDiv\n )}\n </div>\n )}\n\n {prompt && (\n <Typography component={'span'} className={classes.prompt}>\n <PreviewPrompt defaultClassName=\"prompt\" prompt={model.prompt} />\n </Typography>\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 className={classnames(classes.editor, 'response-area-editor')}\n onChange={this.changeSessionValue}\n markup={value || ''}\n maxWidth={width && width.toString()}\n minWidth={'100px'}\n minHeight={height && height.toString()}\n maxHeight={maxHeight}\n disabled={disabled}\n highlightShape={true}\n toolbarOpts={toolbarOpts}\n spellCheck={spellCheckEnabled}\n charactersLimit={50000}\n autoWidthToolbar\n pluginProps={{\n math: {\n disabled: !mathInput,\n customKeys: this.props.model.customKeys,\n keypadMode: this.props.model.equationEditor,\n controlledKeypadMode: false,\n },\n video: {\n disabled: true,\n },\n audio: {\n disabled: true,\n },\n table: {\n disabled: true,\n },\n textAlign: {\n disabled: true,\n },\n separateParagraphs: { disabled: false },\n }}\n languageCharactersProps={languageCharactersProps}\n />\n )}\n\n {feedback && <Feedback correctness=\"correct\" feedback={feedback} />}\n </UiLayout>\n );\n }\n}\n\nexport default withStyles(style)(Main);\n"],"file":"main.js"}
|
package/module/configure.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{_dll_react as e,_dll_prop_types as t,_dll_material_ui__core as n,_dll_material_ui__core_styles as a,_dll_react_dom as i}from"../../../@pie-lib/shared-module@^1.17.5/module/index.js";import{_dll_pie_lib__config_ui as s}from"../../../@pie-lib/config-module@^2.23.3/module/index.js";import{_dll_pie_lib__editable_html as o}from"../../../@pie-lib/editable-html-module@^5.9.5/module/index.js";var l={};Object.defineProperty(l,"__esModule",{value:!0});class r extends CustomEvent{constructor(e,t=!1){super(r.TYPE,{bubbles:!0,detail:{update:e,reset:t}}),this.update=e,this.reset=t}}r.TYPE="model.updated";var d=l.ModelUpdatedEvent=r;class c extends CustomEvent{constructor(e,t){super(c.TYPE,{bubbles:!0,detail:{src:e,done:t}}),this.src=e,this.done=t}}c.TYPE="delete.image";var p=l.DeleteImageEvent=c;class u extends CustomEvent{constructor(e){super(u.TYPE,{bubbles:!0,detail:e}),this.handler=e}}u.TYPE="insert.image";var h=l.InsertImageEvent=u;class g extends CustomEvent{constructor(e,t){super(g.TYPE,{bubbles:!0,detail:{src:e,done:t}}),this.src=e,this.done=t}}g.TYPE="delete.sound";var b=l.DeleteSoundEvent=g;class m extends CustomEvent{constructor(e){super(m.TYPE,{bubbles:!0,detail:e}),this.handler=e}}m.TYPE="insert.sound";var E=l.InsertSoundEvent=m;const _=e,f=t,{Typography:C}=n,{withStyles:I}=a,{FeedbackSelector:v}=s,{InputContainer:S}=s,{settings:x}=s,{layout:y}=s,k=o,{ALL_PLUGINS:P}=o;function w(e){let t,n=e[0],a=1;for(;a<e.length;){const i=e[a],s=e[a+1];if(a+=2,("optionalAccess"===i||"optionalCall"===i)&&null==n)return;"access"===i||"optionalAccess"===i?(t=n,n=s(n)):"call"!==i&&"optionalCall"!==i||(n=s(((...e)=>n.call(t,...e))),t=void 0)}return n}const{Panel:T,toggle:M,numberFields:A,dropdown:D}=x,R={type:"default",default:"Your answer has been submitted"};class q extends _.Component{static __initStatic(){this.propTypes={onModelChanged:f.func.isRequired,onConfigurationChanged:f.func,model:f.object.isRequired,configuration:f.object.isRequired,imageSupport:f.object.isRequired,uploadSoundSupport:f.object.isRequired,classes:f.object.isRequired}}constructor(e){super(e),q.prototype.__init.call(this),q.prototype.__init2.call(this),q.prototype.__init3.call(this),this.state={setDimensions:!0}}__init(){this.onPromptChange=e=>{const{onModelChanged:t,model:n}=this.props;t({...n,prompt:e})}}__init2(){this.changeFeedback=e=>{const{model:t,onModelChanged:n}=this.props;n({...t,feedback:e})}}__init3(){this.changeTeacherInstructions=e=>{const{model:t,onModelChanged:n}=this.props;n({...t,teacherInstructions:e})}}render(){const{model:e,classes:t,configuration:n,imageSupport:a,onConfigurationChanged:i,onModelChanged:s,uploadSoundSupport:o}=this.props,{annotations:l={},contentDimensions:r={},dimensions:d={},equationEditor:c={},feedback:p={},playerSpellCheck:u={},prompt:h={},settingsPanelDisabled:g,spanishInput:b={},specialInput:m={},spellCheck:E={},studentInstructions:f={},teacherInstructions:I={},mathInput:x={},maxImageWidth:q={},maxImageHeight:Y={},multiple:j={},withRubric:O={},mathMlOptions:H={},baseInputConfiguration:N={}}=n||{},{errors:F={},extraCSSRules:G,feedbackEnabled:W,promptEnabled:L,spellCheckEnabled:z,teacherInstructionsEnabled:B,toolbarEditorPosition:U}=e||{},{prompt:J,teacherInstructions:K}=F,Q=q&&q.prompt,V=Y&&Y.prompt,X={position:"top"===U?"top":"bottom"},Z={mathInput:x.settings&&M(x.label),equationEditor:c.enabled&&e.mathInput&&D(c.label,["non-negative-integers","integers","decimals","fractions","Grade 1 - 2","Grade 3 - 5","Grade 6 - 7","Grade 8 - HS","geometry","advanced-algebra","statistics","item-authoring"]),spanishInput:b.settings&&M(b.label),specialInput:m.settings&&M(m.label),dimensions:d.settings&&A(d.label,{width:{label:"Width (px)",suffix:"px",min:100,max:1200},height:{label:"Height (px)",suffix:"px",min:100,max:500}}),"multiple.enabled":j.settings&&M(j.label,!0),promptEnabled:h.settings&&M(h.label),feedbackEnabled:p.settings&&M(p.label),annotationsEnabled:l.settings&&M(l.label),spellCheckEnabled:E.settings&&M(E.label),playerSpellCheckDisabled:u.settings&&M(u.label)},$={teacherInstructionsEnabled:I.settings&&M(I.label),studentInstructionsEnabled:f.settings&&M(f.label),rubricEnabled:w([O,"optionalAccess",e=>e.settings])&&M(w([O,"optionalAccess",e=>e.label]))},ee=e=>Object.assign({...N},e||{});return _.createElement(y.ConfigLayout,{extraCSSRules:G,dimensions:r,hideSettings:g,settings:_.createElement(T,{model:e,configuration:n,onChangeModel:e=>s(e),onChangeConfiguration:e=>i(e),groups:{Settings:Z,Properties:$}})},B&&_.createElement(S,{label:I.label,className:t.promptContainer},_.createElement(k,{className:t.prompt,markup:e.teacherInstructions||"",onChange:this.changeTeacherInstructions,imageSupport:a,nonEmpty:!1,error:K,toolbarOpts:X,spellCheck:z,maxImageWidth:q&&q.teacherInstructions||Q,maxImageHeight:Y&&Y.teacherInstructions||V,uploadSoundSupport:o,languageCharactersProps:[{language:"spanish"},{language:"special"}],mathMlOptions:H,pluginProps:ee(w([I,"optionalAccess",e=>e.inputConfiguration]))}),K&&_.createElement("div",{className:t.errorText},K)),L&&_.createElement(S,{label:h.label,className:t.promptContainer},_.createElement(k,{activePlugins:P,className:t.prompt,markup:e.prompt||"",onChange:this.onPromptChange,imageSupport:a,nonEmpty:!1,error:J,toolbarOpts:X,spellCheck:z,maxImageWidth:Q,maxImageHeight:V,uploadSoundSupport:o,languageCharactersProps:[{language:"spanish"},{language:"special"}],mathMlOptions:H,pluginProps:ee(w([h,"optionalAccess",e=>e.inputConfiguration]))}),J&&_.createElement("div",{className:t.errorText},J)),W&&_.createElement(_.Fragment,null,_.createElement(C,{className:t.header,variant:"subheading"},"Feedback"),_.createElement(v,{label:"When submitted, show",feedback:e.feedback||R,onChange:this.changeFeedback,toolbarOpts:X})))}}q.__initStatic();var Y=I((e=>({header:{paddingBottom:e.spacing.unit},promptContainer:{paddingTop:2*e.spacing.unit,marginBottom:2*e.spacing.unit,width:"100%"},errorText:{fontSize:e.typography.fontSize-2,color:e.palette.error.main,paddingTop:e.spacing.unit}})))(q),j={annotationsEnabled:!1,dimensions:{height:100,width:500},equationEditor:"Grade 8 - HS",feedbackEnabled:!1,mathInput:!1,playerSpellCheckDisabled:!0,predefinedAnnotations:[{label:"good",text:"good",type:"positive"},{label:"★",text:"★",type:"positive"},{label:":-)",text:":-)",type:"positive"},{label:"creative",text:"creative",type:"positive"},{label:"run-on",text:"run-on",type:"negative"},{label:"frag",text:"fragment",type:"negative"},{label:"tran",text:"transition",type:"negative"},{label:"supp",text:"support needed",type:"negative"},{label:"punc",text:"punctuation",type:"negative"},{label:"agr",text:"agreement wrong",type:"negative"},{label:"unclear",text:"unclear",type:"negative"},{label:"cut",text:"cut",type:"negative"},{label:"sp",text:"spelling",type:"negative"},{label:"cap",text:"capitalization",type:"negative"},{label:"inf",text:"informal",type:"negative"},{label:"awk",text:"awkward",type:"negative"}],prompt:"",promptEnabled:!0,rationale:"",rationaleEnabled:!0,spanishInput:!1,specialInput:!1,spellCheckEnabled:!0,studentInstructionsEnabled:!0,teacherInstructions:"",teacherInstructionsEnabled:!0,toolbarEditorPosition:"bottom"},O={annotations:{settings:!1,label:"Annotations"},baseInputConfiguration:{audio:{disabled:!1},video:{disabled:!1},image:{disabled:!1},h3:{disabled:!0},blockquote:{disabled:!0},textAlign:{disabled:!0},showParagraphs:{disabled:!1},separateParagraphs:{disabled:!0}},dimensions:{settings:!0,label:"Text-Entry Display Size"},spellCheck:{label:"Spellcheck",settings:!1,enabled:!0},playerSpellCheck:{label:"Disable Student Spellcheck",settings:!0,enabled:!0},equationEditor:{settings:!1,label:"Equation Editor",enabled:!0},feedback:{settings:!0,label:"Feedback"},mathInput:{settings:!0,label:"Student response can include math notation",enabled:!1},settingsPanelDisabled:!1,spanishInput:{settings:!0,label:"Students can insert Spanish",enabled:!1},specialInput:{settings:!0,label:"Students can insert Special Characters",enabled:!1},multiple:{settings:!1,label:"Multiple Parts",enabled:!1},studentInstructions:{settings:!1,label:"Student Instructions"},prompt:{settings:!0,label:"Prompt",inputConfiguration:{audio:{disabled:!1},video:{disabled:!1},image:{disabled:!1}},required:!1},teacherInstructions:{settings:!0,label:"Teacher Instructions",inputConfiguration:{audio:{disabled:!1},video:{disabled:!1},image:{disabled:!1}},required:!1},maxImageWidth:{teacherInstructions:300,prompt:300},maxImageHeight:{teacherInstructions:300,prompt:300},withRubric:{settings:!1,label:"Add Rubric"},mathMlOptions:{mmlOutput:!1,mmlEditing:!1}};const H=e,N=i;function F(e){let t,n=e[0],a=1;for(;a<e.length;){const i=e[a],s=e[a+1];if(a+=2,("optionalAccess"===i||"optionalCall"===i)&&null==n)return;"access"===i||"optionalAccess"===i?(t=n,n=s(n)):"call"!==i&&"optionalCall"!==i||(n=s(((...e)=>n.call(t,...e))),t=void 0)}return n}class G extends HTMLElement{static __initStatic(){this.createDefaultModel=(e={},t)=>{const n={...j,...e};return F([t,"optionalAccess",e=>e.withRubric,"optionalAccess",e=>e.forceEnabled])&&!n.rubricEnabled&&(n.rubricEnabled=!0),n}}constructor(){super(),this._configuration=O,F([this,"access",e=>e._configuration,"access",e=>e.withRubric,"optionalAccess",e=>e.forceEnabled])&&(this._configuration.withRubric.settings=!1),this._model=G.createDefaultModel({},this._configuration)}set model(e){this._model=G.createDefaultModel(e,this._configuration),this.render()}set configuration(e){this._configuration={...O,...e};const{withRubric:t={}}=e||{};F([t,"optionalAccess",e=>e.forceEnabled])&&(this._configuration.withRubric.settings=!1,this._model.rubricEnabled||(this._model.rubricEnabled=!0)),this.render()}onModelChanged(e){this._model=e,this.render(),this.dispatchEvent(new d(this._model,!1))}onConfigurationChanged(e){this._configuration={...O,...e},this._model&&this.onModelChanged(this._model),this.render()}insertImage(e){this.dispatchEvent(new h(e))}onDeleteImage(e,t){this.dispatchEvent(new p(e,t))}insertSound(e){this.dispatchEvent(new E(e))}onDeleteSound(e,t){this.dispatchEvent(new b(e,t))}render(){if(this._model){const e=H.createElement(Y,{model:this._model,configuration:this._configuration,onModelChanged:this.onModelChanged.bind(this),onConfigurationChanged:this.onConfigurationChanged.bind(this),imageSupport:{add:this.insertImage.bind(this),delete:this.onDeleteImage.bind(this)},uploadSoundSupport:{add:this.insertSound.bind(this),delete:this.onDeleteSound.bind(this)}});N.render(e,this)}}}G.__initStatic();export{G as default};
|
|
1
|
+
import{_dll_react as e,_dll_prop_types as t,_dll_material_ui__core as n,_dll_material_ui__core_styles as a,_dll_react_dom as i}from"../../../@pie-lib/shared-module@^1.17.3/module/index.js";import{_dll_pie_lib__config_ui as s}from"../../../@pie-lib/config-module@^2.23.1/module/index.js";import{_dll_pie_lib__editable_html as o}from"../../../@pie-lib/editable-html-module@^5.9.3/module/index.js";var l={};Object.defineProperty(l,"__esModule",{value:!0});class r extends CustomEvent{constructor(e,t=!1){super(r.TYPE,{bubbles:!0,detail:{update:e,reset:t}}),this.update=e,this.reset=t}}r.TYPE="model.updated";var d=l.ModelUpdatedEvent=r;class c extends CustomEvent{constructor(e,t){super(c.TYPE,{bubbles:!0,detail:{src:e,done:t}}),this.src=e,this.done=t}}c.TYPE="delete.image";var p=l.DeleteImageEvent=c;class u extends CustomEvent{constructor(e){super(u.TYPE,{bubbles:!0,detail:e}),this.handler=e}}u.TYPE="insert.image";var h=l.InsertImageEvent=u;class g extends CustomEvent{constructor(e,t){super(g.TYPE,{bubbles:!0,detail:{src:e,done:t}}),this.src=e,this.done=t}}g.TYPE="delete.sound";var b=l.DeleteSoundEvent=g;class m extends CustomEvent{constructor(e){super(m.TYPE,{bubbles:!0,detail:e}),this.handler=e}}m.TYPE="insert.sound";var E=l.InsertSoundEvent=m;const _=e,f=t,{Typography:C}=n,{withStyles:I}=a,{FeedbackSelector:v}=s,{InputContainer:S}=s,{settings:x}=s,{layout:y}=s,k=o,{ALL_PLUGINS:P}=o;function w(e){let t,n=e[0],a=1;for(;a<e.length;){const i=e[a],s=e[a+1];if(a+=2,("optionalAccess"===i||"optionalCall"===i)&&null==n)return;"access"===i||"optionalAccess"===i?(t=n,n=s(n)):"call"!==i&&"optionalCall"!==i||(n=s(((...e)=>n.call(t,...e))),t=void 0)}return n}const{Panel:T,toggle:M,numberFields:A,dropdown:D}=x,R={type:"default",default:"Your answer has been submitted"};class q extends _.Component{static __initStatic(){this.propTypes={onModelChanged:f.func.isRequired,onConfigurationChanged:f.func,model:f.object.isRequired,configuration:f.object.isRequired,imageSupport:f.object.isRequired,uploadSoundSupport:f.object.isRequired,classes:f.object.isRequired}}constructor(e){super(e),q.prototype.__init.call(this),q.prototype.__init2.call(this),q.prototype.__init3.call(this),this.state={setDimensions:!0}}__init(){this.onPromptChange=e=>{const{onModelChanged:t,model:n}=this.props;t({...n,prompt:e})}}__init2(){this.changeFeedback=e=>{const{model:t,onModelChanged:n}=this.props;n({...t,feedback:e})}}__init3(){this.changeTeacherInstructions=e=>{const{model:t,onModelChanged:n}=this.props;n({...t,teacherInstructions:e})}}render(){const{model:e,classes:t,configuration:n,imageSupport:a,onConfigurationChanged:i,onModelChanged:s,uploadSoundSupport:o}=this.props,{annotations:l={},contentDimensions:r={},dimensions:d={},equationEditor:c={},feedback:p={},playerSpellCheck:u={},prompt:h={},settingsPanelDisabled:g,spanishInput:b={},specialInput:m={},spellCheck:E={},studentInstructions:f={},teacherInstructions:I={},mathInput:x={},maxImageWidth:q={},maxImageHeight:Y={},multiple:j={},withRubric:O={},mathMlOptions:H={},baseInputConfiguration:N={}}=n||{},{errors:F={},extraCSSRules:G,feedbackEnabled:W,promptEnabled:L,spellCheckEnabled:z,teacherInstructionsEnabled:B,toolbarEditorPosition:U}=e||{},{prompt:J,teacherInstructions:K}=F,Q=q&&q.prompt,V=Y&&Y.prompt,X={position:"top"===U?"top":"bottom"},Z={mathInput:x.settings&&M(x.label),equationEditor:c.enabled&&e.mathInput&&D(c.label,["non-negative-integers","integers","decimals","fractions","Grade 1 - 2","Grade 3 - 5","Grade 6 - 7","Grade 8 - HS","geometry","advanced-algebra","statistics","item-authoring"]),spanishInput:b.settings&&M(b.label),specialInput:m.settings&&M(m.label),dimensions:d.settings&&A(d.label,{width:{label:"Width (px)",suffix:"px",min:100,max:1200},height:{label:"Height (px)",suffix:"px",min:100,max:500}}),"multiple.enabled":j.settings&&M(j.label,!0),promptEnabled:h.settings&&M(h.label),feedbackEnabled:p.settings&&M(p.label),annotationsEnabled:l.settings&&M(l.label),spellCheckEnabled:E.settings&&M(E.label),playerSpellCheckDisabled:u.settings&&M(u.label)},$={teacherInstructionsEnabled:I.settings&&M(I.label),studentInstructionsEnabled:f.settings&&M(f.label),rubricEnabled:w([O,"optionalAccess",e=>e.settings])&&M(w([O,"optionalAccess",e=>e.label]))},ee=e=>Object.assign({...N},e||{});return _.createElement(y.ConfigLayout,{extraCSSRules:G,dimensions:r,hideSettings:g,settings:_.createElement(T,{model:e,configuration:n,onChangeModel:e=>s(e),onChangeConfiguration:e=>i(e),groups:{Settings:Z,Properties:$}})},B&&_.createElement(S,{label:I.label,className:t.promptContainer},_.createElement(k,{className:t.prompt,markup:e.teacherInstructions||"",onChange:this.changeTeacherInstructions,imageSupport:a,nonEmpty:!1,error:K,toolbarOpts:X,spellCheck:z,maxImageWidth:q&&q.teacherInstructions||Q,maxImageHeight:Y&&Y.teacherInstructions||V,uploadSoundSupport:o,languageCharactersProps:[{language:"spanish"},{language:"special"}],mathMlOptions:H,pluginProps:ee(w([I,"optionalAccess",e=>e.inputConfiguration]))}),K&&_.createElement("div",{className:t.errorText},K)),L&&_.createElement(S,{label:h.label,className:t.promptContainer},_.createElement(k,{activePlugins:P,className:t.prompt,markup:e.prompt||"",onChange:this.onPromptChange,imageSupport:a,nonEmpty:!1,error:J,toolbarOpts:X,spellCheck:z,maxImageWidth:Q,maxImageHeight:V,uploadSoundSupport:o,languageCharactersProps:[{language:"spanish"},{language:"special"}],mathMlOptions:H,pluginProps:ee(w([h,"optionalAccess",e=>e.inputConfiguration]))}),J&&_.createElement("div",{className:t.errorText},J)),W&&_.createElement(_.Fragment,null,_.createElement(C,{className:t.header,variant:"subheading"},"Feedback"),_.createElement(v,{label:"When submitted, show",feedback:e.feedback||R,onChange:this.changeFeedback,toolbarOpts:X})))}}q.__initStatic();var Y=I((e=>({header:{paddingBottom:e.spacing.unit},promptContainer:{paddingTop:2*e.spacing.unit,marginBottom:2*e.spacing.unit,width:"100%"},errorText:{fontSize:e.typography.fontSize-2,color:e.palette.error.main,paddingTop:e.spacing.unit}})))(q),j={annotationsEnabled:!1,dimensions:{height:100,width:500},equationEditor:"Grade 8 - HS",feedbackEnabled:!1,mathInput:!1,playerSpellCheckDisabled:!0,predefinedAnnotations:[{label:"good",text:"good",type:"positive"},{label:"★",text:"★",type:"positive"},{label:":-)",text:":-)",type:"positive"},{label:"creative",text:"creative",type:"positive"},{label:"run-on",text:"run-on",type:"negative"},{label:"frag",text:"fragment",type:"negative"},{label:"tran",text:"transition",type:"negative"},{label:"supp",text:"support needed",type:"negative"},{label:"punc",text:"punctuation",type:"negative"},{label:"agr",text:"agreement wrong",type:"negative"},{label:"unclear",text:"unclear",type:"negative"},{label:"cut",text:"cut",type:"negative"},{label:"sp",text:"spelling",type:"negative"},{label:"cap",text:"capitalization",type:"negative"},{label:"inf",text:"informal",type:"negative"},{label:"awk",text:"awkward",type:"negative"}],prompt:"",promptEnabled:!0,rationale:"",rationaleEnabled:!0,spanishInput:!1,specialInput:!1,spellCheckEnabled:!0,studentInstructionsEnabled:!0,teacherInstructions:"",teacherInstructionsEnabled:!0,toolbarEditorPosition:"bottom"},O={annotations:{settings:!1,label:"Annotations"},baseInputConfiguration:{audio:{disabled:!1},video:{disabled:!1},image:{disabled:!1},h3:{disabled:!0},blockquote:{disabled:!0},textAlign:{disabled:!0},showParagraphs:{disabled:!1},separateParagraphs:{disabled:!0}},dimensions:{settings:!0,label:"Text-Entry Display Size"},spellCheck:{label:"Spellcheck",settings:!1,enabled:!0},playerSpellCheck:{label:"Disable Student Spellcheck",settings:!0,enabled:!0},equationEditor:{settings:!1,label:"Equation Editor",enabled:!0},feedback:{settings:!0,label:"Feedback"},mathInput:{settings:!0,label:"Student response can include math notation",enabled:!1},settingsPanelDisabled:!1,spanishInput:{settings:!0,label:"Students can insert Spanish",enabled:!1},specialInput:{settings:!0,label:"Students can insert Special Characters",enabled:!1},multiple:{settings:!1,label:"Multiple Parts",enabled:!1},studentInstructions:{settings:!1,label:"Student Instructions"},prompt:{settings:!0,label:"Prompt",inputConfiguration:{audio:{disabled:!1},video:{disabled:!1},image:{disabled:!1}},required:!1},teacherInstructions:{settings:!0,label:"Teacher Instructions",inputConfiguration:{audio:{disabled:!1},video:{disabled:!1},image:{disabled:!1}},required:!1},maxImageWidth:{teacherInstructions:300,prompt:300},maxImageHeight:{teacherInstructions:300,prompt:300},withRubric:{settings:!1,label:"Add Rubric"},mathMlOptions:{mmlOutput:!1,mmlEditing:!1}};const H=e,N=i;function F(e){let t,n=e[0],a=1;for(;a<e.length;){const i=e[a],s=e[a+1];if(a+=2,("optionalAccess"===i||"optionalCall"===i)&&null==n)return;"access"===i||"optionalAccess"===i?(t=n,n=s(n)):"call"!==i&&"optionalCall"!==i||(n=s(((...e)=>n.call(t,...e))),t=void 0)}return n}class G extends HTMLElement{static __initStatic(){this.createDefaultModel=(e={},t)=>{const n={...j,...e};return F([t,"optionalAccess",e=>e.withRubric,"optionalAccess",e=>e.forceEnabled])&&!n.rubricEnabled&&(n.rubricEnabled=!0),n}}constructor(){super(),this._configuration=O,F([this,"access",e=>e._configuration,"access",e=>e.withRubric,"optionalAccess",e=>e.forceEnabled])&&(this._configuration.withRubric.settings=!1),this._model=G.createDefaultModel({},this._configuration)}set model(e){this._model=G.createDefaultModel(e,this._configuration),this.render()}set configuration(e){this._configuration={...O,...e};const{withRubric:t={}}=e||{};F([t,"optionalAccess",e=>e.forceEnabled])&&(this._configuration.withRubric.settings=!1,this._model.rubricEnabled||(this._model.rubricEnabled=!0)),this.render()}onModelChanged(e){this._model=e,this.render(),this.dispatchEvent(new d(this._model,!1))}onConfigurationChanged(e){this._configuration={...O,...e},this._model&&this.onModelChanged(this._model),this.render()}insertImage(e){this.dispatchEvent(new h(e))}onDeleteImage(e,t){this.dispatchEvent(new p(e,t))}insertSound(e){this.dispatchEvent(new E(e))}onDeleteSound(e,t){this.dispatchEvent(new b(e,t))}render(){if(this._model){const e=H.createElement(Y,{model:this._model,configuration:this._configuration,onModelChanged:this.onModelChanged.bind(this),onConfigurationChanged:this.onConfigurationChanged.bind(this),imageSupport:{add:this.insertImage.bind(this),delete:this.onDeleteImage.bind(this)},uploadSoundSupport:{add:this.insertSound.bind(this),delete:this.onDeleteSound.bind(this)}});N.render(e,this)}}}G.__initStatic();export{G as default};
|
package/module/element.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{_dll_react as e,_dll_classnames as t,_dll_prop_types as n,_dll_material_ui__core as o,_dll_material_ui__core_styles as i,_dll_lodash as s,_dll_debug as a,_dll_pie_lib__render_ui as r,_dll_react_dom as l}from"../../../@pie-lib/shared-module@^1.17.5/module/index.js";import{_dll_pie_lib__math_rendering as d}from"../../../@pie-lib/math-rendering-module@^3.1.5/module/index.js";import{_dll_pie_lib__editable_html as c}from"../../../@pie-lib/editable-html-module@^5.9.5/module/index.js";import{_dll_pie_lib__config_ui as p}from"../../../@pie-lib/config-module@^2.23.3/module/index.js";const h=(e,t,n)=>{const o=n||[],i=o.reduce(((e,t)=>e+t.textContent.length),0);let s=!0;if(i>t)return!1;for(e&&(3===e.nodeType&&e.parentNode&&!e.parentNode.hasAttribute("data-ann-id")&&o.push(e),e=e.firstChild);e&&s;)s=h(e,t,o),e=e.nextSibling;return o},m=e=>{const{commonAncestorContainer:t,startContainer:n,endContainer:o,startOffset:i,endOffset:s}=e,a=[];let r=!1,l=!1,d="";const c=e=>{const{nodeValue:t,childNodes:p}=e;e===n&&e===o?(t&&(d+=t.substring(i,s)),r=l=!0):e===n?(t&&(d+=t.substring(i)),r=!0):e===o?(t&&(d+=t.substring(0,s)),l=!0):e&&3===e.nodeType&&e.parentNode&&!e.parentNode.hasAttribute("data-ann-id")&&t&&r&&!l&&(d+=t,a.push(e)),p.forEach((e=>{l||c(e)}))};return c(t),[a,d]},u=e=>{const t=document.createElement("SPAN");return e.surroundContents(t),t},g=e=>{if(e.startContainer===e.endContainer)return[u(e)];const[t]=m(e),n=document.createRange();n.selectNodeContents(e.startContainer),n.setStart(e.startContainer,e.startOffset);const o=u(n),i=document.createRange();i.selectNode(e.endContainer),i.setEnd(e.endContainer,e.endOffset);const s=u(i);return[o,...t.map((e=>{const t=document.createElement("SPAN");return e.parentNode.insertBefore(t,e),t.appendChild(e),t})),s]},b=(e,t)=>{(e||[]).forEach((e=>{const t=e.parentNode,n=e.childNodes,o=n.length;if(o>0)for(let i=0;i<o;i++)t.insertBefore(n[0],e);else t.insertBefore(document.createTextNode(e.textContent),e);t.removeChild(e)})),t.normalize()},f=()=>{document.getSelection?(document.getSelection().removeAllRanges(),document.getSelection().addRange(document.createRange())):window.getSelection?window.getSelection().removeAllRanges?(window.getSelection().removeAllRanges(),window.getSelection().addRange(document.createRange())):window.getSelection().empty&&window.getSelection().empty():document.selection&&document.selection.empty()},v=e=>e.length>=20||-1!==e.search(/\n|\r|\r\n/),C=e=>Array.from(document.querySelectorAll(`[data-id='${e}']`)),x=e=>document.querySelector(`[data-ann-id='${e}']`),y=e,_=t,E=n,{Popover:w}=o,{TextField:S}=o,{withStyles:A}=i;class R extends y.Component{static __initStatic(){this.propTypes={anchorEl:E.object,open:E.bool,offset:E.number,value:E.string,type:E.string,onClose:E.func,onDelete:E.func,onSave:E.func,onTypeChange:E.func}}constructor(e){super(e),R.prototype.__init.call(this),R.prototype.__init2.call(this),R.prototype.__init3.call(this),this.state={value:e.value}}UNSAFE_componentWillReceiveProps(e){const{value:t}=e,{value:n}=this.props;t!==n&&this.setState({value:t})}__init(){this.onValueChange=e=>this.setState({value:e.target.value})}__init2(){this.handleSave=()=>{const{value:e,onSave:t,onClose:n,onDelete:o}=this.props,{value:i}=this.state;""===i&&o(),e!==i&&t(e,i),this.setState({value:""}),n()}}__init3(){this.handleTypeChange=()=>{const{onTypeChange:e,onDelete:t}=this.props,{value:n}=this.state;""===n?t():e(n),this.setState({value:""})}}render(){const{anchorEl:e,classes:t,offset:n,onDelete:o,open:i,type:s}=this.props,{value:a}=this.state;return y.createElement(w,{anchorEl:e,elevation:2,open:i,onClose:this.handleSave,classes:{paper:_(t.arrow,s)},style:{marginTop:`${n}px`,transition:"margin-top 2s ease-out"},anchorOrigin:{vertical:"top",horizontal:"right"},transformOrigin:{vertical:"top",horizontal:"left"}},y.createElement("div",{className:_(t.wrapper,s)},y.createElement(S,{id:"annotation-editor",style:{padding:"2px 5px",width:"95%"},autoFocus:!0,multiline:!0,rows:1,rowsMax:4,value:a,onChange:this.onValueChange,InputProps:{disableUnderline:!0}}),y.createElement("div",{className:t.holder},y.createElement("div",{className:t.button,onClick:o},"Delete"),y.createElement("div",{className:_(t.button,s),onClick:this.handleTypeChange},"negative"===s?"Green":"Pink"),y.createElement("div",{className:t.button,onClick:this.handleSave},"Save"))))}}R.__initStatic();var k=A((e=>({wrapper:{width:"200px",overflow:"hidden",borderRadius:"4px",backgroundColor:"#ffffff",border:`4px solid ${e.palette.grey[100]}`,"&.negative":{borderColor:"rgb(255, 204, 238) !important"},"&.positive":{borderColor:"rgb(153, 255, 153) !important"}},holder:{display:"flex",flexWrap:"wrap",borderTop:`2px solid ${e.palette.grey[100]}`},positive:{backgroundColor:"rgb(153, 255, 153) !important","&:hover":{filter:"brightness(85%)"}},negative:{backgroundColor:"rgb(255, 204, 238) !important","&:hover":{filter:"brightness(85%)"}},button:{flexGrow:1,width:"28%",textAlign:"center",padding:"4px",cursor:"pointer","&:not(:nth-child(3n))":{borderRight:`1px solid ${e.palette.grey[100]}`},"&:hover":{backgroundColor:e.palette.grey[100]},"&.negative:hover":{backgroundColor:"rgb(153, 255, 153) !important"},"&.positive:hover":{backgroundColor:"rgb(255, 204, 238) !important"}},arrow:{overflowX:"unset",overflowY:"unset",marginLeft:"16px","&::before":{position:"absolute",right:"100%",top:"13px",border:"solid transparent",content:'""',height:0,width:0,pointerEvents:"none",borderWidth:"7px",borderRightColor:e.palette.grey[100]},"&.negative::before":{borderRightColor:"rgb(255, 204, 238) !important"},"&.positive::before":{borderRightColor:"rgb(153, 255, 153) !important"}}})))(R);const N=e,T=t,M=n,{withStyles:L}=i,{Popover:I}=o;class W extends N.Component{static __initStatic(){this.propTypes={anchorEl:M.object,open:M.bool,annotations:M.array,isNewAnnotation:M.bool,onClose:M.func,onDelete:M.func,onEdit:M.func,onWrite:M.func,onAnnotate:M.func}}render(){const{anchorEl:e,annotations:t,classes:n,isNewAnnotation:o,onAnnotate:i,onClose:s,onEdit:a,onDelete:r,onWrite:l,open:d}=this.props;return N.createElement(I,{anchorEl:e,open:d,onClose:s,classes:{paper:n.arrow},elevation:5,anchorOrigin:{vertical:"top",horizontal:"center"},transformOrigin:{vertical:"bottom",horizontal:"center"}},N.createElement("div",{className:n.mainWrapper},N.createElement("div",{className:n.annotationsWrapper},t.map(((e,t)=>N.createElement("div",{key:`annotation-${t}`,className:T(n.button,"positive"===e.type?n.positive:n.negative),onClick:()=>i(e)},e.label)))),N.createElement("div",{className:n.controlsWrapper},N.createElement("div",{className:n.button,onClick:s},"Cancel"),N.createElement("div",{style:{pointerEvents:"none"},className:n.button}),o?N.createElement(N.Fragment,null,N.createElement("div",{className:T(n.button,n.positive),onClick:()=>l("positive")},"Write"),N.createElement("div",{className:T(n.button,n.negative),onClick:()=>l("negative")},"Write")):N.createElement(N.Fragment,null,N.createElement("div",{className:n.button,onClick:r},"Delete"),N.createElement("div",{className:n.button,onClick:a},"Edit")))))}}W.__initStatic();var P=L((e=>({mainWrapper:{width:"300px",overflow:"hidden",borderRadius:"4px",backgroundColor:e.palette.common.white,border:`2px solid ${e.palette.grey[100]}`},annotationsWrapper:{display:"flex",flexWrap:"wrap"},controlsWrapper:{display:"flex",flexWrap:"wrap",borderTop:`2px solid ${e.palette.grey[100]}`},button:{width:"22%",textAlign:"center",padding:"4px",cursor:"pointer",borderBottom:`1px solid ${e.palette.grey[100]}`,"&:not(:nth-child(4n))":{borderRight:`1px solid ${e.palette.grey[100]}`},"&:nth-child(4n)":{flexGrow:1},"&:hover":{backgroundColor:e.palette.grey[100]}},positive:{backgroundColor:"rgb(153, 255, 153) !important","&:hover":{filter:"brightness(85%)"}},negative:{backgroundColor:"rgb(255, 204, 238) !important","&:hover":{filter:"brightness(85%)"}},holder:{display:"flex",flexWrap:"wrap",borderTop:`2px solid ${e.palette.grey[100]}`},arrow:{overflowX:"unset",overflowY:"unset",marginTop:"-16px","&::after":{position:"absolute",left:"calc(50% - 7px)",border:"solid transparent",content:'""',height:0,width:0,pointerEvents:"none",borderWidth:"7px",borderTopColor:"black"}}})))(W);const D=e,{withStyles:H}=i,O=t,$=n,z=c,{InputContainer:j}=p;class q extends D.Component{static __initStatic(){this.propTypes={text:$.string,comment:$.string,annotations:$.array,predefinedAnnotations:$.array,onChange:$.func.isRequired,onCommentChange:$.func.isRequired,width:$.number,height:$.number,maxHeight:$.string,disabled:$.bool,disabledMath:$.bool,customKeys:$.array,keypadMode:$.string,classes:$.object.isRequired}}constructor(e){super(e),q.prototype.__init.call(this),q.prototype.__init2.call(this),q.prototype.__init3.call(this),q.prototype.__init4.call(this),q.prototype.__init5.call(this),q.prototype.__init6.call(this),q.prototype.__init7.call(this),q.prototype.__init8.call(this),q.prototype.__init9.call(this),q.prototype.__init10.call(this),q.prototype.__init11.call(this),q.prototype.__init12.call(this),q.prototype.__init13.call(this),q.prototype.__init14.call(this),q.prototype.__init15.call(this),this.state={anchorEl:null,openedMenu:!1,openedEditor:!1,selectedElems:[],labelElem:null,selectionDetails:null,annotation:null,annotationIndex:null}}componentDidMount(){const{annotations:e,text:t}=this.props;t&&e.forEach((e=>{const[t,n]=((e,t,n)=>{const o=h(n,t),i=[];let s=0;return o.forEach((n=>{const o=s+n.textContent.length;[e,t].forEach((e=>{s<=e&&e<o&&i.push({node:n,offset:e-s})})),s=o})),i})(e.start,e.end,this.textRef);if(t&&n){const o=document.createRange();o.setStart(t.node,t.offset),o.setEnd(n.node,n.offset);const i=g(o);this.createDOMAnnotation(i,e)}})),this.textRef&&(this.adjustAnnotationsPosition(),this.textRef.addEventListener("scroll",this.adjustAnnotationsPosition))}__init(){this.adjustAnnotationsPosition=()=>{if(this.textRef&&this.labelsRef){const e=this.textRef.offsetLeft+this.textRef.offsetWidth+8;Array.from(this.labelsRef.children).forEach((t=>{const n=C(t.dataset.annId),o=(n[0].offsetTop?n[0].offsetTop:n[0].offsetParent.offsetTop)-this.textRef.scrollTop-6;t.style.top=`${o}px`,t.style.left=`${e}px`}))}}}__init2(){this.handleClick=e=>{const{annotations:t,classes:n}=this.props,{selectionDetails:o}=this.state;if(o)return;const{id:i,annId:s}=e.target.dataset,a=i||s,r=C(a),l=x(a),d=t.findIndex((e=>e.id===a)),c=l.hasAttribute("data-freeform");c&&l.classList.add(n.highlight),this.setState({anchorEl:r[0],openedMenu:!!i||!!s&&!c,openedEditor:!!s&&c,selectedElems:r,labelElem:l,annotationIndex:d,annotation:t[d],selectionDetails:null})}}__init3(){this.handleHover=e=>{const{classes:t}=this.props,{id:n,annId:o}=e.target.dataset,i=n||o,s=C(i),a=x(i),r=a.hasAttribute("data-freeform");s.forEach((e=>e.classList.add(t.hover))),a.classList.add(r?t.sideAnnotationHover:t.labelHover)}}__init4(){this.handleCancelHover=e=>{const{classes:t}=this.props,{id:n,annId:o}=e.target.dataset,i=n||o,s=C(i),a=x(i),r=a.hasAttribute("data-freeform");s.forEach((e=>e.classList.remove(t.hover))),a.classList.remove(r?t.sideAnnotationHover:t.labelHover)}}__init5(){this.handleClose=e=>{const{classes:t}=this.props,{selectedElems:n,labelElem:o}=this.state;n.length&&!n[0].hasAttribute("data-id")&&b(n,this.textRef),o&&o.classList.remove(t.highlight),this.setState({anchorEl:null,openedMenu:!1,openedEditor:!1,selectedElems:[],labelElem:null,selectionDetails:null,annotationIndex:null,annotation:null}),f()}}__init6(){this.handleSelection=e=>{const t=window.getSelection();if(e.detail>2)f();else if(t&&t.rangeCount>0){const e=t.getRangeAt(0),n=e.toString(),o=this.textRef.contains(e.commonAncestorContainer);if(!t.isCollapsed&&""!==n&&o){const t=((e,t)=>{const n=document.createRange();n.setStart(t,0),n.setEnd(e.startContainer,e.startOffset);const[,o]=m(n),[,i]=m(e),s=o.length;return{quote:i,start:s,end:s+i.length}})(e,this.textRef),n=g(e);this.setState({anchorEl:n[0],openedMenu:!0,selectedElems:n,selectionDetails:t})}}}}__init7(){this.deleteAnnotation=()=>{const{annotations:e,onChange:t}=this.props,{selectedElems:n,labelElem:o,annotationIndex:i,annotation:s}=this.state;(v(s.label)?this.labelsRef:n[0]).removeChild(o),b(n,this.textRef),e.splice(i,1),t(e),this.handleClose()}}__init8(){this.createDOMAnnotation=(e,t)=>{const{classes:n,disabled:o}=this.props,{id:i,label:s,type:a}=t;(e||[]).forEach((e=>{e.dataset.id=i,e.className=O(n.annotation,a),e.onclick=!o&&this.handleClick,e.onmouseover=this.handleHover,e.onmouseout=this.handleCancelHover}));const r=e&&e[0]||{},l=document.createElement("SPAN");if(l.dataset.annId=i,l.innerHTML=s,l.onclick=!o&&this.handleClick,l.onmouseover=this.handleHover,l.onmouseout=this.handleCancelHover,v(s)){const e=(r.offsetTop?r.offsetTop:r.offsetParent.offsetTop)-this.textRef.scrollTop,t=this.textRef.offsetLeft+this.textRef.offsetWidth+8;l.dataset.freeform=!0,l.className=O(n.sideAnnotation,a),l.style.top=`${e}px`,l.style.left=`${t}px`,this.labelsRef.appendChild(l)}else l.className=O(n.annotationLabel,a),r.appendChild(l)}}__init9(){this.createNewAnnotation=(e,t)=>{const{selectedElems:n,selectionDetails:o}=this.state,i={id:[o.start,o.end,(new Date).getTime()].join("-"),label:e,type:t,...o};return this.createDOMAnnotation(n,i),i}}__init10(){this.handleMenuClick=e=>{const{annotations:t,onChange:n}=this.props,{annotation:o,annotationIndex:i}=this.state,{type:s,text:a}=e;if(o){const e={...o,label:a,type:s},{type:n,label:r}=o;this.updateLabel(r,e,s!==n&&n),t.splice(i,1,e)}else{const e=this.createNewAnnotation(a,s);t.push(e)}n(t),this.handleClose()}}__init11(){this.editAnnotation=()=>{this.setState({openedMenu:!1,openedEditor:!0})}}__init12(){this.addAnnotation=e=>{const{annotations:t,onChange:n}=this.props,o=this.createNewAnnotation("",e),i=x(o.id);t.push(o),this.setState({openedMenu:!1,openedEditor:!0,annotationIndex:t.length-1,annotation:o,labelElem:i}),n(t)}}__init13(){this.updateLabel=(e,t,n)=>{const{selectedElems:o,labelElem:i}=this.state,{label:s,type:a}=t;v(s)&&v(e)||!v(s)&&!v(e)?(i.innerHTML=s,n&&(i.classList.remove(n),i.classList.add(a),o.forEach((e=>{e.classList.remove(n),e.classList.add(a)})))):v(s)&&!v(e)?(o[0].removeChild(i),this.createDOMAnnotation(o,t)):!v(s)&&v(e)&&(this.labelsRef.removeChild(i),this.createDOMAnnotation(o,t))}}__init14(){this.changeAnnotationType=e=>{const{annotations:t,onChange:n}=this.props,{annotationIndex:o,selectedElems:i}=this.state,{type:s,label:a}=t[o],r="positive"===s?"negative":"positive",l={...t[o],type:r,label:e};i.forEach((e=>{e.classList.remove(s),e.classList.add(r)})),this.updateLabel(a,l,s),t.splice(o,1,l),n(t),this.handleClose()}}__init15(){this.updateAnnotation=(e,t)=>{const{annotations:n,onChange:o}=this.props,{annotationIndex:i}=this.state,s={...n[i],label:t};this.updateLabel(e,s),n.splice(i,1,s),o(n)}}componentWillUnmount(){this.textRef.removeEventListener("scroll",this.adjustAnnotationsPosition)}render(){const{classes:e,comment:t,customKeys:n,disabled:o,disabledMath:i,keypadMode:s,height:a,width:r,maxHeight:l,onCommentChange:d,predefinedAnnotations:c,text:p}=this.props,{anchorEl:h,annotation:m,openedMenu:u,openedEditor:g,selectionDetails:b}=this.state,v=h&&(h.offsetTop?h.offsetTop:h.offsetParent.offsetTop),C=this.textRef&&v?v-this.textRef.scrollTop-8:0;return D.createElement("div",null,D.createElement("div",{className:e.wrapper},D.createElement("div",{className:e.textContainer,style:{width:r-34,minHeight:a,maxHeight:l},ref:e=>this.textRef=e,onMouseDown:o?()=>{}:f,onMouseUp:o?()=>{}:this.handleSelection,dangerouslySetInnerHTML:{__html:p}}),D.createElement("div",{className:e.labelsContainer,ref:e=>this.labelsRef=e})),D.createElement(j,{label:"Comment",className:e.commentContainer},D.createElement(z,{className:e.prompt,markup:t||"",onChange:d,width:r&&(r+104).toString(),disabled:o,pluginProps:{math:{disabled:i,customKeys:n,keypadMode:s,controlledKeypadMode:!1},video:{disabled:!0},audio:{disabled:!0},textAlign:{disabled:!0}}})),D.createElement(P,{anchorEl:h,open:u&&!o,annotations:c,isNewAnnotation:!!b,onClose:this.handleClose,onDelete:this.deleteAnnotation,onEdit:this.editAnnotation,onWrite:this.addAnnotation,onAnnotate:this.handleMenuClick}),D.createElement(k,{anchorEl:this.textRef,open:g&&!o,offset:C,value:m&&m.label||"",type:m&&m.type,onClose:this.handleClose,onDelete:this.deleteAnnotation,onSave:this.updateAnnotation,onTypeChange:this.changeAnnotationType}))}}q.__initStatic();var B=H((e=>({textContainer:{padding:"10px 120px 10px 16px",backgroundColor:"rgba(0, 0, 0, 0.06)",border:"1px solid #ccc",borderRadius:"4px",overflowY:"scroll",lineHeight:"36px",whiteSpace:"pre-wrap",overflowWrap:"break-word","& p":{margin:0},"& span[data-latex]":{userSelect:"none","-webkit-user-select":"none","-moz-user-select":"none","-ms-user-select":"none"}},labelsContainer:{width:"230px"},wrapper:{position:"relative",overflowX:"hidden",display:"flex"},commentContainer:{paddingTop:2*e.spacing.unit,marginBottom:2*e.spacing.unit,marginTop:2*e.spacing.unit,width:"100%"},annotation:{position:"relative",cursor:"pointer","&.positive":{backgroundColor:"rgb(51, 255, 51, 0.5)"},"&.negative":{backgroundColor:"rgba(255, 102, 204, 0.4)"}},annotationLabel:{backgroundColor:"rgb(242, 242, 242)",padding:"2px",position:"absolute",userSelect:"none",whiteSpace:"nowrap",top:"-10px",left:"-2px",fontSize:e.typography.fontSize-2,fontStyle:"normal",fontWeight:"normal",lineHeight:"6px","-webkit-user-select":"none","-moz-user-select":"none","-ms-user-select":"none","&.positive":{color:"rgb(0, 128, 0)"},"&.negative":{color:"rgb(204, 0, 136)"}},labelHover:{zIndex:20,"&.positive":{color:"rgb(0, 77, 0)"},"&.negative":{color:"rgb(153, 0, 102)"}},highlight:{zIndex:10},hover:{zIndex:20,"&.positive":{backgroundColor:"rgb(51, 255, 51, 0.7)"},"&.negative":{backgroundColor:"rgba(255, 102, 204, 0.55)"}},sideAnnotationHover:{zIndex:20,"&.negative":{backgroundColor:"rgb(255, 179, 230) !important","&:before":{borderRightColor:"rgb(255, 179, 230) !important"}},"&.positive":{backgroundColor:"rgb(128, 255, 128) !important","&:before":{borderRightColor:"rgb(153, 255, 153) !important"}}},sideAnnotation:{position:"absolute",padding:e.spacing.unit/2,borderRadius:"4px",marginLeft:e.spacing.unit,width:"180px",whiteSpace:"pre-wrap",wordBreak:"break-word",border:`2px solid ${e.palette.common.white}`,fontSize:e.typography.fontSize,fontStyle:"normal",fontWeight:"normal","&:before":{position:"absolute",right:"100%",top:"5px",border:"solid transparent",content:'""',height:0,width:0,pointerEvents:"none",borderWidth:"7px"},"&.negative":{backgroundColor:"rgb(255, 204, 238)","&:before":{borderRightColor:"rgb(255, 204, 238)"}},"&.positive":{backgroundColor:"rgb(153, 255, 153)","&:before":{borderRightColor:"rgb(153, 255, 153)"}}}})))(q);const K=e,F=n,V=t,{debounce:Y}=s,U=a,{Typography:G}=o,{withStyles:X}=i,{color:Q}=r,{Feedback:J}=r,{Collapsible:Z}=r,{PreviewPrompt:ee}=r,{UiLayout:te}=r,ne=c,oe=U("@pie-ui:extended-text-entry");class ie extends K.Component{constructor(...e){super(...e),ie.prototype.__init.call(this),ie.prototype.__init2.call(this)}static __initStatic(){this.propTypes={onValueChange:F.func.isRequired,onAnnotationsChange:F.func.isRequired,onCommentChange:F.func.isRequired,model:F.object,classes:F.object.isRequired,session:F.shape({value:F.string,annotations:F.array,comment:F.string}).isRequired}}__init(){this.changeSessionValue=Y(this.props.onValueChange,1500)}__init2(){this.changeSessionComment=Y(this.props.onCommentChange,1500)}render(){const{model:e,classes:t,session:n,onAnnotationsChange:o}=this.props,{animationsDisabled:i,annotatorMode:s,customKeys:a,dimensions:r,disabled:l,disabledAnnotator:d,equationEditor:c,extraCSSRules:p,feedback:h,mathInput:m,playersToolbarPosition:u,predefinedAnnotations:g,prompt:b,spanishInput:f,specialInput:v,spellCheckEnabled:C,teacherInstructions:x}=e,{annotations:y,comment:_,value:E}=n,{width:w,height:S}=r||{},A="40vh",R={position:"top"===u?"top":"bottom"};oe("[render] disabled? ",l);const k=K.createElement(ee,{defaultClassName:"teacher-instructions",prompt:x}),N=[];return f&&N.push({language:"spanish"}),v&&N.push({language:"special"}),K.createElement(te,{extraCSSRules:p,className:t.main,ref:e=>{this.containerRef=e}},K.createElement("h2",{className:t.srOnly},"Constructed Response Question"),x&&K.createElement("div",{className:t.teacherInstructions},i?k:K.createElement(Z,{labels:{hidden:"Show Teacher Instructions",visible:"Hide Teacher Instructions"},className:t.collapsible},k)),b&&K.createElement(G,{component:"span",className:t.prompt},K.createElement(ee,{defaultClassName:"prompt",prompt:e.prompt})),s?K.createElement(B,{text:E||"",annotations:y||[],comment:_||"",predefinedAnnotations:g||[],onChange:o,onCommentChange:this.changeSessionComment,width:w,height:S,maxHeight:A,disabled:d,disabledMath:!m,customKeys:a,keypadMode:c}):K.createElement(ne,{className:V(t.editor,"response-area-editor"),onChange:this.changeSessionValue,markup:E||"",maxWidth:w&&w.toString(),minWidth:"100px",minHeight:S&&S.toString(),maxHeight:A,disabled:l,highlightShape:!0,toolbarOpts:R,spellCheck:C,charactersLimit:5e4,autoWidthToolbar:!0,pluginProps:{math:{disabled:!m,customKeys:this.props.model.customKeys,keypadMode:this.props.model.equationEditor,controlledKeypadMode:!1},video:{disabled:!0},audio:{disabled:!0},table:{disabled:!0},textAlign:{disabled:!0},separateParagraphs:{disabled:!1},ul_list:{disabled:!0},ol_list:{disabled:!0}},languageCharactersProps:N}),h&&K.createElement(J,{correctness:"correct",feedback:h}))}}ie.__initStatic();var se=X((e=>({main:{backgroundColor:Q.background(),color:Q.text()},prompt:{width:"100%",color:Q.text(),marginBottom:2*e.spacing.unit,fontSize:"inherit"},teacherInstructions:{marginBottom:2*e.spacing.unit},editor:{marginBottom:2*e.spacing.unit,borderRadius:"4px"},srOnly:{position:"absolute",left:"-10000px",top:"auto",width:"1px",height:"1px",overflow:"hidden"}})))(ie),ae={};Object.defineProperty(ae,"__esModule",{value:!0});class re extends CustomEvent{constructor(e,t,n){super(re.TYPE,{bubbles:!0,composed:!0,detail:{complete:t,component:e,hasModel:n}}),this.component=e,this.complete=t}}re.TYPE="model-set";var le=ae.ModelSetEvent=re;class de extends CustomEvent{constructor(e,t){super(de.TYPE,{bubbles:!0,composed:!0,detail:{complete:t,component:e}}),this.component=e,this.complete=t}}de.TYPE="session-changed";var ce=ae.SessionChangedEvent=de;const pe=e,he=l,me=a,{renderMath:ue}=d,ge=me("@pie-elements:extended-text-entry"),be=void 0!==typeof window?new DOMParser:{parseFromString:e=>e};function fe(e){if("string"==typeof e)try{const t=be.parseFromString(e,"text/html");return t.body.textContent}catch(t){return ge("tried to parse as dom and failed",e),e}}function ve(e){const t=fe(e);return void 0!==t&&t.length>0}class Ce extends HTMLElement{constructor(){super(),this._model=null,this._session=null}setLangAttribute(){const e=this._model&&(this._model.language,1)?this._model.language:"",t=e?e.slice(0,2):"en";this.setAttribute("lang",t)}set model(e){this._model=e,this.dispatchEvent(new le(this.tagName.toLowerCase(),!1,!!this._model)),this.render()}set session(e){this._session=e,this.render()}get session(){return this._session}valueChange(e){this._session.value=e,this.dispatchEvent(new ce(this.tagName.toLowerCase(),ve(e))),this.render()}annotationsChange(e){this._session.annotations=e,this.dispatchEvent(new ce(this.tagName.toLowerCase(),!0)),this.render()}commentChange(e){this._session.comment=e,this.dispatchEvent(new ce(this.tagName.toLowerCase(),ve(e))),this.render()}connectedCallback(){this.setAttribute("aria-label","Written Response Question"),this.setAttribute("role","region"),this.render()}render(){if(this._model&&this._session){let e=pe.createElement(se,{model:this._model,session:this._session,onValueChange:this.valueChange.bind(this),onAnnotationsChange:this.annotationsChange.bind(this),onCommentChange:this.commentChange.bind(this)});this.setLangAttribute(),he.render(e,this,(()=>{ue(this)}))}}}export{Ce as default,ve as isComplete,fe as textContent};
|
|
1
|
+
import{_dll_react as e,_dll_classnames as t,_dll_prop_types as n,_dll_material_ui__core as o,_dll_material_ui__core_styles as i,_dll_lodash as s,_dll_debug as a,_dll_pie_lib__render_ui as r,_dll_react_dom as l}from"../../../@pie-lib/shared-module@^1.17.3/module/index.js";import{_dll_pie_lib__math_rendering as d}from"../../../@pie-lib/math-rendering-module@^3.1.3/module/index.js";import{_dll_pie_lib__editable_html as c}from"../../../@pie-lib/editable-html-module@^5.9.3/module/index.js";import{_dll_pie_lib__config_ui as p}from"../../../@pie-lib/config-module@^2.23.1/module/index.js";const h=(e,t,n)=>{const o=n||[],i=o.reduce(((e,t)=>e+t.textContent.length),0);let s=!0;if(i>t)return!1;for(e&&(3===e.nodeType&&e.parentNode&&!e.parentNode.hasAttribute("data-ann-id")&&o.push(e),e=e.firstChild);e&&s;)s=h(e,t,o),e=e.nextSibling;return o},m=e=>{const{commonAncestorContainer:t,startContainer:n,endContainer:o,startOffset:i,endOffset:s}=e,a=[];let r=!1,l=!1,d="";const c=e=>{const{nodeValue:t,childNodes:p}=e;e===n&&e===o?(t&&(d+=t.substring(i,s)),r=l=!0):e===n?(t&&(d+=t.substring(i)),r=!0):e===o?(t&&(d+=t.substring(0,s)),l=!0):e&&3===e.nodeType&&e.parentNode&&!e.parentNode.hasAttribute("data-ann-id")&&t&&r&&!l&&(d+=t,a.push(e)),p.forEach((e=>{l||c(e)}))};return c(t),[a,d]},u=e=>{const t=document.createElement("SPAN");return e.surroundContents(t),t},g=e=>{if(e.startContainer===e.endContainer)return[u(e)];const[t]=m(e),n=document.createRange();n.selectNodeContents(e.startContainer),n.setStart(e.startContainer,e.startOffset);const o=u(n),i=document.createRange();i.selectNode(e.endContainer),i.setEnd(e.endContainer,e.endOffset);const s=u(i);return[o,...t.map((e=>{const t=document.createElement("SPAN");return e.parentNode.insertBefore(t,e),t.appendChild(e),t})),s]},b=(e,t)=>{(e||[]).forEach((e=>{const t=e.parentNode,n=e.childNodes,o=n.length;if(o>0)for(let i=0;i<o;i++)t.insertBefore(n[0],e);else t.insertBefore(document.createTextNode(e.textContent),e);t.removeChild(e)})),t.normalize()},f=()=>{document.getSelection?(document.getSelection().removeAllRanges(),document.getSelection().addRange(document.createRange())):window.getSelection?window.getSelection().removeAllRanges?(window.getSelection().removeAllRanges(),window.getSelection().addRange(document.createRange())):window.getSelection().empty&&window.getSelection().empty():document.selection&&document.selection.empty()},v=e=>e.length>=20||-1!==e.search(/\n|\r|\r\n/),C=e=>Array.from(document.querySelectorAll(`[data-id='${e}']`)),x=e=>document.querySelector(`[data-ann-id='${e}']`),y=e,E=t,_=n,{Popover:w}=o,{TextField:S}=o,{withStyles:A}=i;class R extends y.Component{static __initStatic(){this.propTypes={anchorEl:_.object,open:_.bool,offset:_.number,value:_.string,type:_.string,onClose:_.func,onDelete:_.func,onSave:_.func,onTypeChange:_.func}}constructor(e){super(e),R.prototype.__init.call(this),R.prototype.__init2.call(this),R.prototype.__init3.call(this),this.state={value:e.value}}UNSAFE_componentWillReceiveProps(e){const{value:t}=e,{value:n}=this.props;t!==n&&this.setState({value:t})}__init(){this.onValueChange=e=>this.setState({value:e.target.value})}__init2(){this.handleSave=()=>{const{value:e,onSave:t,onClose:n,onDelete:o}=this.props,{value:i}=this.state;""===i&&o(),e!==i&&t(e,i),this.setState({value:""}),n()}}__init3(){this.handleTypeChange=()=>{const{onTypeChange:e,onDelete:t}=this.props,{value:n}=this.state;""===n?t():e(n),this.setState({value:""})}}render(){const{anchorEl:e,classes:t,offset:n,onDelete:o,open:i,type:s}=this.props,{value:a}=this.state;return y.createElement(w,{anchorEl:e,elevation:2,open:i,onClose:this.handleSave,classes:{paper:E(t.arrow,s)},style:{marginTop:`${n}px`,transition:"margin-top 2s ease-out"},anchorOrigin:{vertical:"top",horizontal:"right"},transformOrigin:{vertical:"top",horizontal:"left"}},y.createElement("div",{className:E(t.wrapper,s)},y.createElement(S,{id:"annotation-editor",style:{padding:"2px 5px",width:"95%"},autoFocus:!0,multiline:!0,rows:1,rowsMax:4,value:a,onChange:this.onValueChange,InputProps:{disableUnderline:!0}}),y.createElement("div",{className:t.holder},y.createElement("div",{className:t.button,onClick:o},"Delete"),y.createElement("div",{className:E(t.button,s),onClick:this.handleTypeChange},"negative"===s?"Green":"Pink"),y.createElement("div",{className:t.button,onClick:this.handleSave},"Save"))))}}R.__initStatic();var k=A((e=>({wrapper:{width:"200px",overflow:"hidden",borderRadius:"4px",backgroundColor:"#ffffff",border:`4px solid ${e.palette.grey[100]}`,"&.negative":{borderColor:"rgb(255, 204, 238) !important"},"&.positive":{borderColor:"rgb(153, 255, 153) !important"}},holder:{display:"flex",flexWrap:"wrap",borderTop:`2px solid ${e.palette.grey[100]}`},positive:{backgroundColor:"rgb(153, 255, 153) !important","&:hover":{filter:"brightness(85%)"}},negative:{backgroundColor:"rgb(255, 204, 238) !important","&:hover":{filter:"brightness(85%)"}},button:{flexGrow:1,width:"28%",textAlign:"center",padding:"4px",cursor:"pointer","&:not(:nth-child(3n))":{borderRight:`1px solid ${e.palette.grey[100]}`},"&:hover":{backgroundColor:e.palette.grey[100]},"&.negative:hover":{backgroundColor:"rgb(153, 255, 153) !important"},"&.positive:hover":{backgroundColor:"rgb(255, 204, 238) !important"}},arrow:{overflowX:"unset",overflowY:"unset",marginLeft:"16px","&::before":{position:"absolute",right:"100%",top:"13px",border:"solid transparent",content:'""',height:0,width:0,pointerEvents:"none",borderWidth:"7px",borderRightColor:e.palette.grey[100]},"&.negative::before":{borderRightColor:"rgb(255, 204, 238) !important"},"&.positive::before":{borderRightColor:"rgb(153, 255, 153) !important"}}})))(R);const N=e,T=t,M=n,{withStyles:L}=i,{Popover:I}=o;class W extends N.Component{static __initStatic(){this.propTypes={anchorEl:M.object,open:M.bool,annotations:M.array,isNewAnnotation:M.bool,onClose:M.func,onDelete:M.func,onEdit:M.func,onWrite:M.func,onAnnotate:M.func}}render(){const{anchorEl:e,annotations:t,classes:n,isNewAnnotation:o,onAnnotate:i,onClose:s,onEdit:a,onDelete:r,onWrite:l,open:d}=this.props;return N.createElement(I,{anchorEl:e,open:d,onClose:s,classes:{paper:n.arrow},elevation:5,anchorOrigin:{vertical:"top",horizontal:"center"},transformOrigin:{vertical:"bottom",horizontal:"center"}},N.createElement("div",{className:n.mainWrapper},N.createElement("div",{className:n.annotationsWrapper},t.map(((e,t)=>N.createElement("div",{key:`annotation-${t}`,className:T(n.button,"positive"===e.type?n.positive:n.negative),onClick:()=>i(e)},e.label)))),N.createElement("div",{className:n.controlsWrapper},N.createElement("div",{className:n.button,onClick:s},"Cancel"),N.createElement("div",{style:{pointerEvents:"none"},className:n.button}),o?N.createElement(N.Fragment,null,N.createElement("div",{className:T(n.button,n.positive),onClick:()=>l("positive")},"Write"),N.createElement("div",{className:T(n.button,n.negative),onClick:()=>l("negative")},"Write")):N.createElement(N.Fragment,null,N.createElement("div",{className:n.button,onClick:r},"Delete"),N.createElement("div",{className:n.button,onClick:a},"Edit")))))}}W.__initStatic();var P=L((e=>({mainWrapper:{width:"300px",overflow:"hidden",borderRadius:"4px",backgroundColor:e.palette.common.white,border:`2px solid ${e.palette.grey[100]}`},annotationsWrapper:{display:"flex",flexWrap:"wrap"},controlsWrapper:{display:"flex",flexWrap:"wrap",borderTop:`2px solid ${e.palette.grey[100]}`},button:{width:"22%",textAlign:"center",padding:"4px",cursor:"pointer",borderBottom:`1px solid ${e.palette.grey[100]}`,"&:not(:nth-child(4n))":{borderRight:`1px solid ${e.palette.grey[100]}`},"&:nth-child(4n)":{flexGrow:1},"&:hover":{backgroundColor:e.palette.grey[100]}},positive:{backgroundColor:"rgb(153, 255, 153) !important","&:hover":{filter:"brightness(85%)"}},negative:{backgroundColor:"rgb(255, 204, 238) !important","&:hover":{filter:"brightness(85%)"}},holder:{display:"flex",flexWrap:"wrap",borderTop:`2px solid ${e.palette.grey[100]}`},arrow:{overflowX:"unset",overflowY:"unset",marginTop:"-16px","&::after":{position:"absolute",left:"calc(50% - 7px)",border:"solid transparent",content:'""',height:0,width:0,pointerEvents:"none",borderWidth:"7px",borderTopColor:"black"}}})))(W);const D=e,{withStyles:H}=i,O=t,$=n,z=c,{InputContainer:j}=p;class q extends D.Component{static __initStatic(){this.propTypes={text:$.string,comment:$.string,annotations:$.array,predefinedAnnotations:$.array,onChange:$.func.isRequired,onCommentChange:$.func.isRequired,width:$.number,height:$.number,maxHeight:$.string,disabled:$.bool,disabledMath:$.bool,customKeys:$.array,keypadMode:$.string,classes:$.object.isRequired}}constructor(e){super(e),q.prototype.__init.call(this),q.prototype.__init2.call(this),q.prototype.__init3.call(this),q.prototype.__init4.call(this),q.prototype.__init5.call(this),q.prototype.__init6.call(this),q.prototype.__init7.call(this),q.prototype.__init8.call(this),q.prototype.__init9.call(this),q.prototype.__init10.call(this),q.prototype.__init11.call(this),q.prototype.__init12.call(this),q.prototype.__init13.call(this),q.prototype.__init14.call(this),q.prototype.__init15.call(this),this.state={anchorEl:null,openedMenu:!1,openedEditor:!1,selectedElems:[],labelElem:null,selectionDetails:null,annotation:null,annotationIndex:null}}componentDidMount(){const{annotations:e,text:t}=this.props;t&&e.forEach((e=>{const[t,n]=((e,t,n)=>{const o=h(n,t),i=[];let s=0;return o.forEach((n=>{const o=s+n.textContent.length;[e,t].forEach((e=>{s<=e&&e<o&&i.push({node:n,offset:e-s})})),s=o})),i})(e.start,e.end,this.textRef);if(t&&n){const o=document.createRange();o.setStart(t.node,t.offset),o.setEnd(n.node,n.offset);const i=g(o);this.createDOMAnnotation(i,e)}})),this.textRef&&(this.adjustAnnotationsPosition(),this.textRef.addEventListener("scroll",this.adjustAnnotationsPosition))}__init(){this.adjustAnnotationsPosition=()=>{if(this.textRef&&this.labelsRef){const e=this.textRef.offsetLeft+this.textRef.offsetWidth+8;Array.from(this.labelsRef.children).forEach((t=>{const n=C(t.dataset.annId),o=(n[0].offsetTop?n[0].offsetTop:n[0].offsetParent.offsetTop)-this.textRef.scrollTop-6;t.style.top=`${o}px`,t.style.left=`${e}px`}))}}}__init2(){this.handleClick=e=>{const{annotations:t,classes:n}=this.props,{selectionDetails:o}=this.state;if(o)return;const{id:i,annId:s}=e.target.dataset,a=i||s,r=C(a),l=x(a),d=t.findIndex((e=>e.id===a)),c=l.hasAttribute("data-freeform");c&&l.classList.add(n.highlight),this.setState({anchorEl:r[0],openedMenu:!!i||!!s&&!c,openedEditor:!!s&&c,selectedElems:r,labelElem:l,annotationIndex:d,annotation:t[d],selectionDetails:null})}}__init3(){this.handleHover=e=>{const{classes:t}=this.props,{id:n,annId:o}=e.target.dataset,i=n||o,s=C(i),a=x(i),r=a.hasAttribute("data-freeform");s.forEach((e=>e.classList.add(t.hover))),a.classList.add(r?t.sideAnnotationHover:t.labelHover)}}__init4(){this.handleCancelHover=e=>{const{classes:t}=this.props,{id:n,annId:o}=e.target.dataset,i=n||o,s=C(i),a=x(i),r=a.hasAttribute("data-freeform");s.forEach((e=>e.classList.remove(t.hover))),a.classList.remove(r?t.sideAnnotationHover:t.labelHover)}}__init5(){this.handleClose=e=>{const{classes:t}=this.props,{selectedElems:n,labelElem:o}=this.state;n.length&&!n[0].hasAttribute("data-id")&&b(n,this.textRef),o&&o.classList.remove(t.highlight),this.setState({anchorEl:null,openedMenu:!1,openedEditor:!1,selectedElems:[],labelElem:null,selectionDetails:null,annotationIndex:null,annotation:null}),f()}}__init6(){this.handleSelection=e=>{const t=window.getSelection();if(e.detail>2)f();else if(t&&t.rangeCount>0){const e=t.getRangeAt(0),n=e.toString(),o=this.textRef.contains(e.commonAncestorContainer);if(!t.isCollapsed&&""!==n&&o){const t=((e,t)=>{const n=document.createRange();n.setStart(t,0),n.setEnd(e.startContainer,e.startOffset);const[,o]=m(n),[,i]=m(e),s=o.length;return{quote:i,start:s,end:s+i.length}})(e,this.textRef),n=g(e);this.setState({anchorEl:n[0],openedMenu:!0,selectedElems:n,selectionDetails:t})}}}}__init7(){this.deleteAnnotation=()=>{const{annotations:e,onChange:t}=this.props,{selectedElems:n,labelElem:o,annotationIndex:i,annotation:s}=this.state;(v(s.label)?this.labelsRef:n[0]).removeChild(o),b(n,this.textRef),e.splice(i,1),t(e),this.handleClose()}}__init8(){this.createDOMAnnotation=(e,t)=>{const{classes:n,disabled:o}=this.props,{id:i,label:s,type:a}=t;(e||[]).forEach((e=>{e.dataset.id=i,e.className=O(n.annotation,a),e.onclick=!o&&this.handleClick,e.onmouseover=this.handleHover,e.onmouseout=this.handleCancelHover}));const r=e&&e[0]||{},l=document.createElement("SPAN");if(l.dataset.annId=i,l.innerHTML=s,l.onclick=!o&&this.handleClick,l.onmouseover=this.handleHover,l.onmouseout=this.handleCancelHover,v(s)){const e=(r.offsetTop?r.offsetTop:r.offsetParent.offsetTop)-this.textRef.scrollTop,t=this.textRef.offsetLeft+this.textRef.offsetWidth+8;l.dataset.freeform=!0,l.className=O(n.sideAnnotation,a),l.style.top=`${e}px`,l.style.left=`${t}px`,this.labelsRef.appendChild(l)}else l.className=O(n.annotationLabel,a),r.appendChild(l)}}__init9(){this.createNewAnnotation=(e,t)=>{const{selectedElems:n,selectionDetails:o}=this.state,i={id:[o.start,o.end,(new Date).getTime()].join("-"),label:e,type:t,...o};return this.createDOMAnnotation(n,i),i}}__init10(){this.handleMenuClick=e=>{const{annotations:t,onChange:n}=this.props,{annotation:o,annotationIndex:i}=this.state,{type:s,text:a}=e;if(o){const e={...o,label:a,type:s},{type:n,label:r}=o;this.updateLabel(r,e,s!==n&&n),t.splice(i,1,e)}else{const e=this.createNewAnnotation(a,s);t.push(e)}n(t),this.handleClose()}}__init11(){this.editAnnotation=()=>{this.setState({openedMenu:!1,openedEditor:!0})}}__init12(){this.addAnnotation=e=>{const{annotations:t,onChange:n}=this.props,o=this.createNewAnnotation("",e),i=x(o.id);t.push(o),this.setState({openedMenu:!1,openedEditor:!0,annotationIndex:t.length-1,annotation:o,labelElem:i}),n(t)}}__init13(){this.updateLabel=(e,t,n)=>{const{selectedElems:o,labelElem:i}=this.state,{label:s,type:a}=t;v(s)&&v(e)||!v(s)&&!v(e)?(i.innerHTML=s,n&&(i.classList.remove(n),i.classList.add(a),o.forEach((e=>{e.classList.remove(n),e.classList.add(a)})))):v(s)&&!v(e)?(o[0].removeChild(i),this.createDOMAnnotation(o,t)):!v(s)&&v(e)&&(this.labelsRef.removeChild(i),this.createDOMAnnotation(o,t))}}__init14(){this.changeAnnotationType=e=>{const{annotations:t,onChange:n}=this.props,{annotationIndex:o,selectedElems:i}=this.state,{type:s,label:a}=t[o],r="positive"===s?"negative":"positive",l={...t[o],type:r,label:e};i.forEach((e=>{e.classList.remove(s),e.classList.add(r)})),this.updateLabel(a,l,s),t.splice(o,1,l),n(t),this.handleClose()}}__init15(){this.updateAnnotation=(e,t)=>{const{annotations:n,onChange:o}=this.props,{annotationIndex:i}=this.state,s={...n[i],label:t};this.updateLabel(e,s),n.splice(i,1,s),o(n)}}componentWillUnmount(){this.textRef.removeEventListener("scroll",this.adjustAnnotationsPosition)}render(){const{classes:e,comment:t,customKeys:n,disabled:o,disabledMath:i,keypadMode:s,height:a,width:r,maxHeight:l,onCommentChange:d,predefinedAnnotations:c,text:p}=this.props,{anchorEl:h,annotation:m,openedMenu:u,openedEditor:g,selectionDetails:b}=this.state,v=h&&(h.offsetTop?h.offsetTop:h.offsetParent.offsetTop),C=this.textRef&&v?v-this.textRef.scrollTop-8:0;return D.createElement("div",null,D.createElement("div",{className:e.wrapper},D.createElement("div",{className:e.textContainer,style:{width:r-34,minHeight:a,maxHeight:l},ref:e=>this.textRef=e,onMouseDown:o?()=>{}:f,onMouseUp:o?()=>{}:this.handleSelection,dangerouslySetInnerHTML:{__html:p}}),D.createElement("div",{className:e.labelsContainer,ref:e=>this.labelsRef=e})),D.createElement(j,{label:"Comment",className:e.commentContainer},D.createElement(z,{className:e.prompt,markup:t||"",onChange:d,width:r&&(r+104).toString(),disabled:o,pluginProps:{math:{disabled:i,customKeys:n,keypadMode:s,controlledKeypadMode:!1},video:{disabled:!0},audio:{disabled:!0},textAlign:{disabled:!0}}})),D.createElement(P,{anchorEl:h,open:u&&!o,annotations:c,isNewAnnotation:!!b,onClose:this.handleClose,onDelete:this.deleteAnnotation,onEdit:this.editAnnotation,onWrite:this.addAnnotation,onAnnotate:this.handleMenuClick}),D.createElement(k,{anchorEl:this.textRef,open:g&&!o,offset:C,value:m&&m.label||"",type:m&&m.type,onClose:this.handleClose,onDelete:this.deleteAnnotation,onSave:this.updateAnnotation,onTypeChange:this.changeAnnotationType}))}}q.__initStatic();var B=H((e=>({textContainer:{padding:"10px 120px 10px 16px",backgroundColor:"rgba(0, 0, 0, 0.06)",border:"1px solid #ccc",borderRadius:"4px",overflowY:"scroll",lineHeight:"36px",whiteSpace:"pre-wrap",overflowWrap:"break-word","& p":{margin:0},"& span[data-latex]":{userSelect:"none","-webkit-user-select":"none","-moz-user-select":"none","-ms-user-select":"none"}},labelsContainer:{width:"230px"},wrapper:{position:"relative",overflowX:"hidden",display:"flex"},commentContainer:{paddingTop:2*e.spacing.unit,marginBottom:2*e.spacing.unit,marginTop:2*e.spacing.unit,width:"100%"},annotation:{position:"relative",cursor:"pointer","&.positive":{backgroundColor:"rgb(51, 255, 51, 0.5)"},"&.negative":{backgroundColor:"rgba(255, 102, 204, 0.4)"}},annotationLabel:{backgroundColor:"rgb(242, 242, 242)",padding:"2px",position:"absolute",userSelect:"none",whiteSpace:"nowrap",top:"-10px",left:"-2px",fontSize:e.typography.fontSize-2,fontStyle:"normal",fontWeight:"normal",lineHeight:"6px","-webkit-user-select":"none","-moz-user-select":"none","-ms-user-select":"none","&.positive":{color:"rgb(0, 128, 0)"},"&.negative":{color:"rgb(204, 0, 136)"}},labelHover:{zIndex:20,"&.positive":{color:"rgb(0, 77, 0)"},"&.negative":{color:"rgb(153, 0, 102)"}},highlight:{zIndex:10},hover:{zIndex:20,"&.positive":{backgroundColor:"rgb(51, 255, 51, 0.7)"},"&.negative":{backgroundColor:"rgba(255, 102, 204, 0.55)"}},sideAnnotationHover:{zIndex:20,"&.negative":{backgroundColor:"rgb(255, 179, 230) !important","&:before":{borderRightColor:"rgb(255, 179, 230) !important"}},"&.positive":{backgroundColor:"rgb(128, 255, 128) !important","&:before":{borderRightColor:"rgb(153, 255, 153) !important"}}},sideAnnotation:{position:"absolute",padding:e.spacing.unit/2,borderRadius:"4px",marginLeft:e.spacing.unit,width:"180px",whiteSpace:"pre-wrap",wordBreak:"break-word",border:`2px solid ${e.palette.common.white}`,fontSize:e.typography.fontSize,fontStyle:"normal",fontWeight:"normal","&:before":{position:"absolute",right:"100%",top:"5px",border:"solid transparent",content:'""',height:0,width:0,pointerEvents:"none",borderWidth:"7px"},"&.negative":{backgroundColor:"rgb(255, 204, 238)","&:before":{borderRightColor:"rgb(255, 204, 238)"}},"&.positive":{backgroundColor:"rgb(153, 255, 153)","&:before":{borderRightColor:"rgb(153, 255, 153)"}}}})))(q);const K=e,F=n,V=t,{debounce:Y}=s,U=a,{Typography:G}=o,{withStyles:X}=i,{color:Q}=r,{Feedback:J}=r,{Collapsible:Z}=r,{PreviewPrompt:ee}=r,{UiLayout:te}=r,ne=c,oe=U("@pie-ui:extended-text-entry");class ie extends K.Component{constructor(...e){super(...e),ie.prototype.__init.call(this),ie.prototype.__init2.call(this)}static __initStatic(){this.propTypes={onValueChange:F.func.isRequired,onAnnotationsChange:F.func.isRequired,onCommentChange:F.func.isRequired,model:F.object,classes:F.object.isRequired,session:F.shape({value:F.string,annotations:F.array,comment:F.string}).isRequired}}__init(){this.changeSessionValue=Y(this.props.onValueChange,1500)}__init2(){this.changeSessionComment=Y(this.props.onCommentChange,1500)}render(){const{model:e,classes:t,session:n,onAnnotationsChange:o}=this.props,{animationsDisabled:i,annotatorMode:s,customKeys:a,dimensions:r,disabled:l,disabledAnnotator:d,equationEditor:c,extraCSSRules:p,feedback:h,mathInput:m,playersToolbarPosition:u,predefinedAnnotations:g,prompt:b,spanishInput:f,specialInput:v,spellCheckEnabled:C,teacherInstructions:x}=e,{annotations:y,comment:E,value:_}=n,{width:w,height:S}=r||{},A="40vh",R={position:"top"===u?"top":"bottom"};oe("[render] disabled? ",l);const k=K.createElement(ee,{defaultClassName:"teacher-instructions",prompt:x}),N=[];return f&&N.push({language:"spanish"}),v&&N.push({language:"special"}),K.createElement(te,{extraCSSRules:p,className:t.main,ref:e=>{this.containerRef=e}},K.createElement("h2",{className:t.srOnly},"Constructed Response Question"),x&&K.createElement("div",{className:t.teacherInstructions},i?k:K.createElement(Z,{labels:{hidden:"Show Teacher Instructions",visible:"Hide Teacher Instructions"},className:t.collapsible},k)),b&&K.createElement(G,{component:"span",className:t.prompt},K.createElement(ee,{defaultClassName:"prompt",prompt:e.prompt})),s?K.createElement(B,{text:_||"",annotations:y||[],comment:E||"",predefinedAnnotations:g||[],onChange:o,onCommentChange:this.changeSessionComment,width:w,height:S,maxHeight:A,disabled:d,disabledMath:!m,customKeys:a,keypadMode:c}):K.createElement(ne,{className:V(t.editor,"response-area-editor"),onChange:this.changeSessionValue,markup:_||"",maxWidth:w&&w.toString(),minWidth:"100px",minHeight:S&&S.toString(),maxHeight:A,disabled:l,highlightShape:!0,toolbarOpts:R,spellCheck:C,charactersLimit:5e4,autoWidthToolbar:!0,pluginProps:{math:{disabled:!m,customKeys:this.props.model.customKeys,keypadMode:this.props.model.equationEditor,controlledKeypadMode:!1},video:{disabled:!0},audio:{disabled:!0},table:{disabled:!0},textAlign:{disabled:!0},separateParagraphs:{disabled:!1}},languageCharactersProps:N}),h&&K.createElement(J,{correctness:"correct",feedback:h}))}}ie.__initStatic();var se=X((e=>({main:{backgroundColor:Q.background(),color:Q.text()},prompt:{width:"100%",color:Q.text(),marginBottom:2*e.spacing.unit,fontSize:"inherit"},teacherInstructions:{marginBottom:2*e.spacing.unit},editor:{marginBottom:2*e.spacing.unit,borderRadius:"4px"},srOnly:{position:"absolute",left:"-10000px",top:"auto",width:"1px",height:"1px",overflow:"hidden"}})))(ie),ae={};Object.defineProperty(ae,"__esModule",{value:!0});class re extends CustomEvent{constructor(e,t,n){super(re.TYPE,{bubbles:!0,composed:!0,detail:{complete:t,component:e,hasModel:n}}),this.component=e,this.complete=t}}re.TYPE="model-set";var le=ae.ModelSetEvent=re;class de extends CustomEvent{constructor(e,t){super(de.TYPE,{bubbles:!0,composed:!0,detail:{complete:t,component:e}}),this.component=e,this.complete=t}}de.TYPE="session-changed";var ce=ae.SessionChangedEvent=de;const pe=e,he=l,me=a,{renderMath:ue}=d,ge=me("@pie-elements:extended-text-entry"),be=void 0!==typeof window?new DOMParser:{parseFromString:e=>e};function fe(e){if("string"==typeof e)try{const t=be.parseFromString(e,"text/html");return t.body.textContent}catch(t){return ge("tried to parse as dom and failed",e),e}}function ve(e){const t=fe(e);return void 0!==t&&t.length>0}class Ce extends HTMLElement{constructor(){super(),this._model=null,this._session=null}setLangAttribute(){const e=this._model&&(this._model.language,1)?this._model.language:"",t=e?e.slice(0,2):"en";this.setAttribute("lang",t)}set model(e){this._model=e,this.dispatchEvent(new le(this.tagName.toLowerCase(),!1,!!this._model)),this.render()}set session(e){this._session=e,this.render()}get session(){return this._session}valueChange(e){this._session.value=e,this.dispatchEvent(new ce(this.tagName.toLowerCase(),ve(e))),this.render()}annotationsChange(e){this._session.annotations=e,this.dispatchEvent(new ce(this.tagName.toLowerCase(),!0)),this.render()}commentChange(e){this._session.comment=e,this.dispatchEvent(new ce(this.tagName.toLowerCase(),ve(e))),this.render()}connectedCallback(){this.setAttribute("aria-label","Written Response Question"),this.setAttribute("role","region"),this.render()}render(){if(this._model&&this._session){let e=pe.createElement(se,{model:this._model,session:this._session,onValueChange:this.valueChange.bind(this),onAnnotationsChange:this.annotationsChange.bind(this),onCommentChange:this.commentChange.bind(this)});this.setLangAttribute(),he.render(e,this,(()=>{ue(this)}))}}}export{Ce as default,ve as isComplete,fe as textContent};
|
package/module/manifest.json
CHANGED
|
@@ -4,19 +4,19 @@
|
|
|
4
4
|
"modules": [
|
|
5
5
|
{
|
|
6
6
|
"name": "@pie-lib/shared-module",
|
|
7
|
-
"version": "^1.17.
|
|
7
|
+
"version": "^1.17.3"
|
|
8
8
|
},
|
|
9
9
|
{
|
|
10
10
|
"name": "@pie-lib/math-rendering-module",
|
|
11
|
-
"version": "^3.1.
|
|
11
|
+
"version": "^3.1.3"
|
|
12
12
|
},
|
|
13
13
|
{
|
|
14
14
|
"name": "@pie-lib/editable-html-module",
|
|
15
|
-
"version": "^5.9.
|
|
15
|
+
"version": "^5.9.3"
|
|
16
16
|
},
|
|
17
17
|
{
|
|
18
18
|
"name": "@pie-lib/config-module",
|
|
19
|
-
"version": "^2.23.
|
|
19
|
+
"version": "^2.23.1"
|
|
20
20
|
}
|
|
21
21
|
]
|
|
22
22
|
}
|
package/module/print.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{_dll_react as e,_dll_classnames as t,_dll_prop_types as n,_dll_material_ui__core as o,_dll_material_ui__core_styles as i,_dll_lodash as a,_dll_debug as s,_dll_pie_lib__render_ui as r,_dll_react_dom as l}from"../../../@pie-lib/shared-module@^1.17.5/module/index.js";import{_dll_pie_lib__math_rendering as d}from"../../../@pie-lib/math-rendering-module@^3.1.5/module/index.js";import{_dll_pie_lib__editable_html as c}from"../../../@pie-lib/editable-html-module@^5.9.5/module/index.js";import{_dll_pie_lib__config_ui as p}from"../../../@pie-lib/config-module@^2.23.3/module/index.js";const h=(e,t,n)=>{const o=n||[],i=o.reduce(((e,t)=>e+t.textContent.length),0);let a=!0;if(i>t)return!1;for(e&&(3===e.nodeType&&e.parentNode&&!e.parentNode.hasAttribute("data-ann-id")&&o.push(e),e=e.firstChild);e&&a;)a=h(e,t,o),e=e.nextSibling;return o},m=e=>{const{commonAncestorContainer:t,startContainer:n,endContainer:o,startOffset:i,endOffset:a}=e,s=[];let r=!1,l=!1,d="";const c=e=>{const{nodeValue:t,childNodes:p}=e;e===n&&e===o?(t&&(d+=t.substring(i,a)),r=l=!0):e===n?(t&&(d+=t.substring(i)),r=!0):e===o?(t&&(d+=t.substring(0,a)),l=!0):e&&3===e.nodeType&&e.parentNode&&!e.parentNode.hasAttribute("data-ann-id")&&t&&r&&!l&&(d+=t,s.push(e)),p.forEach((e=>{l||c(e)}))};return c(t),[s,d]},u=e=>{const t=document.createElement("SPAN");return e.surroundContents(t),t},g=e=>{if(e.startContainer===e.endContainer)return[u(e)];const[t]=m(e),n=document.createRange();n.selectNodeContents(e.startContainer),n.setStart(e.startContainer,e.startOffset);const o=u(n),i=document.createRange();i.selectNode(e.endContainer),i.setEnd(e.endContainer,e.endOffset);const a=u(i);return[o,...t.map((e=>{const t=document.createElement("SPAN");return e.parentNode.insertBefore(t,e),t.appendChild(e),t})),a]},b=(e,t)=>{(e||[]).forEach((e=>{const t=e.parentNode,n=e.childNodes,o=n.length;if(o>0)for(let i=0;i<o;i++)t.insertBefore(n[0],e);else t.insertBefore(document.createTextNode(e.textContent),e);t.removeChild(e)})),t.normalize()},f=()=>{document.getSelection?(document.getSelection().removeAllRanges(),document.getSelection().addRange(document.createRange())):window.getSelection?window.getSelection().removeAllRanges?(window.getSelection().removeAllRanges(),window.getSelection().addRange(document.createRange())):window.getSelection().empty&&window.getSelection().empty():document.selection&&document.selection.empty()},v=e=>e.length>=20||-1!==e.search(/\n|\r|\r\n/),C=e=>Array.from(document.querySelectorAll(`[data-id='${e}']`)),x=e=>document.querySelector(`[data-ann-id='${e}']`),y=e,_=t,E=n,{Popover:w}=o,{TextField:S}=o,{withStyles:A}=i;class R extends y.Component{static __initStatic(){this.propTypes={anchorEl:E.object,open:E.bool,offset:E.number,value:E.string,type:E.string,onClose:E.func,onDelete:E.func,onSave:E.func,onTypeChange:E.func}}constructor(e){super(e),R.prototype.__init.call(this),R.prototype.__init2.call(this),R.prototype.__init3.call(this),this.state={value:e.value}}UNSAFE_componentWillReceiveProps(e){const{value:t}=e,{value:n}=this.props;t!==n&&this.setState({value:t})}__init(){this.onValueChange=e=>this.setState({value:e.target.value})}__init2(){this.handleSave=()=>{const{value:e,onSave:t,onClose:n,onDelete:o}=this.props,{value:i}=this.state;""===i&&o(),e!==i&&t(e,i),this.setState({value:""}),n()}}__init3(){this.handleTypeChange=()=>{const{onTypeChange:e,onDelete:t}=this.props,{value:n}=this.state;""===n?t():e(n),this.setState({value:""})}}render(){const{anchorEl:e,classes:t,offset:n,onDelete:o,open:i,type:a}=this.props,{value:s}=this.state;return y.createElement(w,{anchorEl:e,elevation:2,open:i,onClose:this.handleSave,classes:{paper:_(t.arrow,a)},style:{marginTop:`${n}px`,transition:"margin-top 2s ease-out"},anchorOrigin:{vertical:"top",horizontal:"right"},transformOrigin:{vertical:"top",horizontal:"left"}},y.createElement("div",{className:_(t.wrapper,a)},y.createElement(S,{id:"annotation-editor",style:{padding:"2px 5px",width:"95%"},autoFocus:!0,multiline:!0,rows:1,rowsMax:4,value:s,onChange:this.onValueChange,InputProps:{disableUnderline:!0}}),y.createElement("div",{className:t.holder},y.createElement("div",{className:t.button,onClick:o},"Delete"),y.createElement("div",{className:_(t.button,a),onClick:this.handleTypeChange},"negative"===a?"Green":"Pink"),y.createElement("div",{className:t.button,onClick:this.handleSave},"Save"))))}}R.__initStatic();var k=A((e=>({wrapper:{width:"200px",overflow:"hidden",borderRadius:"4px",backgroundColor:"#ffffff",border:`4px solid ${e.palette.grey[100]}`,"&.negative":{borderColor:"rgb(255, 204, 238) !important"},"&.positive":{borderColor:"rgb(153, 255, 153) !important"}},holder:{display:"flex",flexWrap:"wrap",borderTop:`2px solid ${e.palette.grey[100]}`},positive:{backgroundColor:"rgb(153, 255, 153) !important","&:hover":{filter:"brightness(85%)"}},negative:{backgroundColor:"rgb(255, 204, 238) !important","&:hover":{filter:"brightness(85%)"}},button:{flexGrow:1,width:"28%",textAlign:"center",padding:"4px",cursor:"pointer","&:not(:nth-child(3n))":{borderRight:`1px solid ${e.palette.grey[100]}`},"&:hover":{backgroundColor:e.palette.grey[100]},"&.negative:hover":{backgroundColor:"rgb(153, 255, 153) !important"},"&.positive:hover":{backgroundColor:"rgb(255, 204, 238) !important"}},arrow:{overflowX:"unset",overflowY:"unset",marginLeft:"16px","&::before":{position:"absolute",right:"100%",top:"13px",border:"solid transparent",content:'""',height:0,width:0,pointerEvents:"none",borderWidth:"7px",borderRightColor:e.palette.grey[100]},"&.negative::before":{borderRightColor:"rgb(255, 204, 238) !important"},"&.positive::before":{borderRightColor:"rgb(153, 255, 153) !important"}}})))(R);const N=e,T=t,M=n,{withStyles:I}=i,{Popover:L}=o;class W extends N.Component{static __initStatic(){this.propTypes={anchorEl:M.object,open:M.bool,annotations:M.array,isNewAnnotation:M.bool,onClose:M.func,onDelete:M.func,onEdit:M.func,onWrite:M.func,onAnnotate:M.func}}render(){const{anchorEl:e,annotations:t,classes:n,isNewAnnotation:o,onAnnotate:i,onClose:a,onEdit:s,onDelete:r,onWrite:l,open:d}=this.props;return N.createElement(L,{anchorEl:e,open:d,onClose:a,classes:{paper:n.arrow},elevation:5,anchorOrigin:{vertical:"top",horizontal:"center"},transformOrigin:{vertical:"bottom",horizontal:"center"}},N.createElement("div",{className:n.mainWrapper},N.createElement("div",{className:n.annotationsWrapper},t.map(((e,t)=>N.createElement("div",{key:`annotation-${t}`,className:T(n.button,"positive"===e.type?n.positive:n.negative),onClick:()=>i(e)},e.label)))),N.createElement("div",{className:n.controlsWrapper},N.createElement("div",{className:n.button,onClick:a},"Cancel"),N.createElement("div",{style:{pointerEvents:"none"},className:n.button}),o?N.createElement(N.Fragment,null,N.createElement("div",{className:T(n.button,n.positive),onClick:()=>l("positive")},"Write"),N.createElement("div",{className:T(n.button,n.negative),onClick:()=>l("negative")},"Write")):N.createElement(N.Fragment,null,N.createElement("div",{className:n.button,onClick:r},"Delete"),N.createElement("div",{className:n.button,onClick:s},"Edit")))))}}W.__initStatic();var D=I((e=>({mainWrapper:{width:"300px",overflow:"hidden",borderRadius:"4px",backgroundColor:e.palette.common.white,border:`2px solid ${e.palette.grey[100]}`},annotationsWrapper:{display:"flex",flexWrap:"wrap"},controlsWrapper:{display:"flex",flexWrap:"wrap",borderTop:`2px solid ${e.palette.grey[100]}`},button:{width:"22%",textAlign:"center",padding:"4px",cursor:"pointer",borderBottom:`1px solid ${e.palette.grey[100]}`,"&:not(:nth-child(4n))":{borderRight:`1px solid ${e.palette.grey[100]}`},"&:nth-child(4n)":{flexGrow:1},"&:hover":{backgroundColor:e.palette.grey[100]}},positive:{backgroundColor:"rgb(153, 255, 153) !important","&:hover":{filter:"brightness(85%)"}},negative:{backgroundColor:"rgb(255, 204, 238) !important","&:hover":{filter:"brightness(85%)"}},holder:{display:"flex",flexWrap:"wrap",borderTop:`2px solid ${e.palette.grey[100]}`},arrow:{overflowX:"unset",overflowY:"unset",marginTop:"-16px","&::after":{position:"absolute",left:"calc(50% - 7px)",border:"solid transparent",content:'""',height:0,width:0,pointerEvents:"none",borderWidth:"7px",borderTopColor:"black"}}})))(W);const H=e,{withStyles:P}=i,O=t,$=n,z=c,{InputContainer:j}=p;class q extends H.Component{static __initStatic(){this.propTypes={text:$.string,comment:$.string,annotations:$.array,predefinedAnnotations:$.array,onChange:$.func.isRequired,onCommentChange:$.func.isRequired,width:$.number,height:$.number,maxHeight:$.string,disabled:$.bool,disabledMath:$.bool,customKeys:$.array,keypadMode:$.string,classes:$.object.isRequired}}constructor(e){super(e),q.prototype.__init.call(this),q.prototype.__init2.call(this),q.prototype.__init3.call(this),q.prototype.__init4.call(this),q.prototype.__init5.call(this),q.prototype.__init6.call(this),q.prototype.__init7.call(this),q.prototype.__init8.call(this),q.prototype.__init9.call(this),q.prototype.__init10.call(this),q.prototype.__init11.call(this),q.prototype.__init12.call(this),q.prototype.__init13.call(this),q.prototype.__init14.call(this),q.prototype.__init15.call(this),this.state={anchorEl:null,openedMenu:!1,openedEditor:!1,selectedElems:[],labelElem:null,selectionDetails:null,annotation:null,annotationIndex:null}}componentDidMount(){const{annotations:e,text:t}=this.props;t&&e.forEach((e=>{const[t,n]=((e,t,n)=>{const o=h(n,t),i=[];let a=0;return o.forEach((n=>{const o=a+n.textContent.length;[e,t].forEach((e=>{a<=e&&e<o&&i.push({node:n,offset:e-a})})),a=o})),i})(e.start,e.end,this.textRef);if(t&&n){const o=document.createRange();o.setStart(t.node,t.offset),o.setEnd(n.node,n.offset);const i=g(o);this.createDOMAnnotation(i,e)}})),this.textRef&&(this.adjustAnnotationsPosition(),this.textRef.addEventListener("scroll",this.adjustAnnotationsPosition))}__init(){this.adjustAnnotationsPosition=()=>{if(this.textRef&&this.labelsRef){const e=this.textRef.offsetLeft+this.textRef.offsetWidth+8;Array.from(this.labelsRef.children).forEach((t=>{const n=C(t.dataset.annId),o=(n[0].offsetTop?n[0].offsetTop:n[0].offsetParent.offsetTop)-this.textRef.scrollTop-6;t.style.top=`${o}px`,t.style.left=`${e}px`}))}}}__init2(){this.handleClick=e=>{const{annotations:t,classes:n}=this.props,{selectionDetails:o}=this.state;if(o)return;const{id:i,annId:a}=e.target.dataset,s=i||a,r=C(s),l=x(s),d=t.findIndex((e=>e.id===s)),c=l.hasAttribute("data-freeform");c&&l.classList.add(n.highlight),this.setState({anchorEl:r[0],openedMenu:!!i||!!a&&!c,openedEditor:!!a&&c,selectedElems:r,labelElem:l,annotationIndex:d,annotation:t[d],selectionDetails:null})}}__init3(){this.handleHover=e=>{const{classes:t}=this.props,{id:n,annId:o}=e.target.dataset,i=n||o,a=C(i),s=x(i),r=s.hasAttribute("data-freeform");a.forEach((e=>e.classList.add(t.hover))),s.classList.add(r?t.sideAnnotationHover:t.labelHover)}}__init4(){this.handleCancelHover=e=>{const{classes:t}=this.props,{id:n,annId:o}=e.target.dataset,i=n||o,a=C(i),s=x(i),r=s.hasAttribute("data-freeform");a.forEach((e=>e.classList.remove(t.hover))),s.classList.remove(r?t.sideAnnotationHover:t.labelHover)}}__init5(){this.handleClose=e=>{const{classes:t}=this.props,{selectedElems:n,labelElem:o}=this.state;n.length&&!n[0].hasAttribute("data-id")&&b(n,this.textRef),o&&o.classList.remove(t.highlight),this.setState({anchorEl:null,openedMenu:!1,openedEditor:!1,selectedElems:[],labelElem:null,selectionDetails:null,annotationIndex:null,annotation:null}),f()}}__init6(){this.handleSelection=e=>{const t=window.getSelection();if(e.detail>2)f();else if(t&&t.rangeCount>0){const e=t.getRangeAt(0),n=e.toString(),o=this.textRef.contains(e.commonAncestorContainer);if(!t.isCollapsed&&""!==n&&o){const t=((e,t)=>{const n=document.createRange();n.setStart(t,0),n.setEnd(e.startContainer,e.startOffset);const[,o]=m(n),[,i]=m(e),a=o.length;return{quote:i,start:a,end:a+i.length}})(e,this.textRef),n=g(e);this.setState({anchorEl:n[0],openedMenu:!0,selectedElems:n,selectionDetails:t})}}}}__init7(){this.deleteAnnotation=()=>{const{annotations:e,onChange:t}=this.props,{selectedElems:n,labelElem:o,annotationIndex:i,annotation:a}=this.state;(v(a.label)?this.labelsRef:n[0]).removeChild(o),b(n,this.textRef),e.splice(i,1),t(e),this.handleClose()}}__init8(){this.createDOMAnnotation=(e,t)=>{const{classes:n,disabled:o}=this.props,{id:i,label:a,type:s}=t;(e||[]).forEach((e=>{e.dataset.id=i,e.className=O(n.annotation,s),e.onclick=!o&&this.handleClick,e.onmouseover=this.handleHover,e.onmouseout=this.handleCancelHover}));const r=e&&e[0]||{},l=document.createElement("SPAN");if(l.dataset.annId=i,l.innerHTML=a,l.onclick=!o&&this.handleClick,l.onmouseover=this.handleHover,l.onmouseout=this.handleCancelHover,v(a)){const e=(r.offsetTop?r.offsetTop:r.offsetParent.offsetTop)-this.textRef.scrollTop,t=this.textRef.offsetLeft+this.textRef.offsetWidth+8;l.dataset.freeform=!0,l.className=O(n.sideAnnotation,s),l.style.top=`${e}px`,l.style.left=`${t}px`,this.labelsRef.appendChild(l)}else l.className=O(n.annotationLabel,s),r.appendChild(l)}}__init9(){this.createNewAnnotation=(e,t)=>{const{selectedElems:n,selectionDetails:o}=this.state,i={id:[o.start,o.end,(new Date).getTime()].join("-"),label:e,type:t,...o};return this.createDOMAnnotation(n,i),i}}__init10(){this.handleMenuClick=e=>{const{annotations:t,onChange:n}=this.props,{annotation:o,annotationIndex:i}=this.state,{type:a,text:s}=e;if(o){const e={...o,label:s,type:a},{type:n,label:r}=o;this.updateLabel(r,e,a!==n&&n),t.splice(i,1,e)}else{const e=this.createNewAnnotation(s,a);t.push(e)}n(t),this.handleClose()}}__init11(){this.editAnnotation=()=>{this.setState({openedMenu:!1,openedEditor:!0})}}__init12(){this.addAnnotation=e=>{const{annotations:t,onChange:n}=this.props,o=this.createNewAnnotation("",e),i=x(o.id);t.push(o),this.setState({openedMenu:!1,openedEditor:!0,annotationIndex:t.length-1,annotation:o,labelElem:i}),n(t)}}__init13(){this.updateLabel=(e,t,n)=>{const{selectedElems:o,labelElem:i}=this.state,{label:a,type:s}=t;v(a)&&v(e)||!v(a)&&!v(e)?(i.innerHTML=a,n&&(i.classList.remove(n),i.classList.add(s),o.forEach((e=>{e.classList.remove(n),e.classList.add(s)})))):v(a)&&!v(e)?(o[0].removeChild(i),this.createDOMAnnotation(o,t)):!v(a)&&v(e)&&(this.labelsRef.removeChild(i),this.createDOMAnnotation(o,t))}}__init14(){this.changeAnnotationType=e=>{const{annotations:t,onChange:n}=this.props,{annotationIndex:o,selectedElems:i}=this.state,{type:a,label:s}=t[o],r="positive"===a?"negative":"positive",l={...t[o],type:r,label:e};i.forEach((e=>{e.classList.remove(a),e.classList.add(r)})),this.updateLabel(s,l,a),t.splice(o,1,l),n(t),this.handleClose()}}__init15(){this.updateAnnotation=(e,t)=>{const{annotations:n,onChange:o}=this.props,{annotationIndex:i}=this.state,a={...n[i],label:t};this.updateLabel(e,a),n.splice(i,1,a),o(n)}}componentWillUnmount(){this.textRef.removeEventListener("scroll",this.adjustAnnotationsPosition)}render(){const{classes:e,comment:t,customKeys:n,disabled:o,disabledMath:i,keypadMode:a,height:s,width:r,maxHeight:l,onCommentChange:d,predefinedAnnotations:c,text:p}=this.props,{anchorEl:h,annotation:m,openedMenu:u,openedEditor:g,selectionDetails:b}=this.state,v=h&&(h.offsetTop?h.offsetTop:h.offsetParent.offsetTop),C=this.textRef&&v?v-this.textRef.scrollTop-8:0;return H.createElement("div",null,H.createElement("div",{className:e.wrapper},H.createElement("div",{className:e.textContainer,style:{width:r-34,minHeight:s,maxHeight:l},ref:e=>this.textRef=e,onMouseDown:o?()=>{}:f,onMouseUp:o?()=>{}:this.handleSelection,dangerouslySetInnerHTML:{__html:p}}),H.createElement("div",{className:e.labelsContainer,ref:e=>this.labelsRef=e})),H.createElement(j,{label:"Comment",className:e.commentContainer},H.createElement(z,{className:e.prompt,markup:t||"",onChange:d,width:r&&(r+104).toString(),disabled:o,pluginProps:{math:{disabled:i,customKeys:n,keypadMode:a,controlledKeypadMode:!1},video:{disabled:!0},audio:{disabled:!0},textAlign:{disabled:!0}}})),H.createElement(D,{anchorEl:h,open:u&&!o,annotations:c,isNewAnnotation:!!b,onClose:this.handleClose,onDelete:this.deleteAnnotation,onEdit:this.editAnnotation,onWrite:this.addAnnotation,onAnnotate:this.handleMenuClick}),H.createElement(k,{anchorEl:this.textRef,open:g&&!o,offset:C,value:m&&m.label||"",type:m&&m.type,onClose:this.handleClose,onDelete:this.deleteAnnotation,onSave:this.updateAnnotation,onTypeChange:this.changeAnnotationType}))}}q.__initStatic();var B=P((e=>({textContainer:{padding:"10px 120px 10px 16px",backgroundColor:"rgba(0, 0, 0, 0.06)",border:"1px solid #ccc",borderRadius:"4px",overflowY:"scroll",lineHeight:"36px",whiteSpace:"pre-wrap",overflowWrap:"break-word","& p":{margin:0},"& span[data-latex]":{userSelect:"none","-webkit-user-select":"none","-moz-user-select":"none","-ms-user-select":"none"}},labelsContainer:{width:"230px"},wrapper:{position:"relative",overflowX:"hidden",display:"flex"},commentContainer:{paddingTop:2*e.spacing.unit,marginBottom:2*e.spacing.unit,marginTop:2*e.spacing.unit,width:"100%"},annotation:{position:"relative",cursor:"pointer","&.positive":{backgroundColor:"rgb(51, 255, 51, 0.5)"},"&.negative":{backgroundColor:"rgba(255, 102, 204, 0.4)"}},annotationLabel:{backgroundColor:"rgb(242, 242, 242)",padding:"2px",position:"absolute",userSelect:"none",whiteSpace:"nowrap",top:"-10px",left:"-2px",fontSize:e.typography.fontSize-2,fontStyle:"normal",fontWeight:"normal",lineHeight:"6px","-webkit-user-select":"none","-moz-user-select":"none","-ms-user-select":"none","&.positive":{color:"rgb(0, 128, 0)"},"&.negative":{color:"rgb(204, 0, 136)"}},labelHover:{zIndex:20,"&.positive":{color:"rgb(0, 77, 0)"},"&.negative":{color:"rgb(153, 0, 102)"}},highlight:{zIndex:10},hover:{zIndex:20,"&.positive":{backgroundColor:"rgb(51, 255, 51, 0.7)"},"&.negative":{backgroundColor:"rgba(255, 102, 204, 0.55)"}},sideAnnotationHover:{zIndex:20,"&.negative":{backgroundColor:"rgb(255, 179, 230) !important","&:before":{borderRightColor:"rgb(255, 179, 230) !important"}},"&.positive":{backgroundColor:"rgb(128, 255, 128) !important","&:before":{borderRightColor:"rgb(153, 255, 153) !important"}}},sideAnnotation:{position:"absolute",padding:e.spacing.unit/2,borderRadius:"4px",marginLeft:e.spacing.unit,width:"180px",whiteSpace:"pre-wrap",wordBreak:"break-word",border:`2px solid ${e.palette.common.white}`,fontSize:e.typography.fontSize,fontStyle:"normal",fontWeight:"normal","&:before":{position:"absolute",right:"100%",top:"5px",border:"solid transparent",content:'""',height:0,width:0,pointerEvents:"none",borderWidth:"7px"},"&.negative":{backgroundColor:"rgb(255, 204, 238)","&:before":{borderRightColor:"rgb(255, 204, 238)"}},"&.positive":{backgroundColor:"rgb(153, 255, 153)","&:before":{borderRightColor:"rgb(153, 255, 153)"}}}})))(q);const K=e,V=n,F=t,{debounce:U}=a,G=s,{Typography:X}=o,{withStyles:Y}=i,{color:Q}=r,{Feedback:J}=r,{Collapsible:Z}=r,{PreviewPrompt:ee}=r,{UiLayout:te}=r,ne=c,oe=G("@pie-ui:extended-text-entry");class ie extends K.Component{constructor(...e){super(...e),ie.prototype.__init.call(this),ie.prototype.__init2.call(this)}static __initStatic(){this.propTypes={onValueChange:V.func.isRequired,onAnnotationsChange:V.func.isRequired,onCommentChange:V.func.isRequired,model:V.object,classes:V.object.isRequired,session:V.shape({value:V.string,annotations:V.array,comment:V.string}).isRequired}}__init(){this.changeSessionValue=U(this.props.onValueChange,1500)}__init2(){this.changeSessionComment=U(this.props.onCommentChange,1500)}render(){const{model:e,classes:t,session:n,onAnnotationsChange:o}=this.props,{animationsDisabled:i,annotatorMode:a,customKeys:s,dimensions:r,disabled:l,disabledAnnotator:d,equationEditor:c,extraCSSRules:p,feedback:h,mathInput:m,playersToolbarPosition:u,predefinedAnnotations:g,prompt:b,spanishInput:f,specialInput:v,spellCheckEnabled:C,teacherInstructions:x}=e,{annotations:y,comment:_,value:E}=n,{width:w,height:S}=r||{},A="40vh",R={position:"top"===u?"top":"bottom"};oe("[render] disabled? ",l);const k=K.createElement(ee,{defaultClassName:"teacher-instructions",prompt:x}),N=[];return f&&N.push({language:"spanish"}),v&&N.push({language:"special"}),K.createElement(te,{extraCSSRules:p,className:t.main,ref:e=>{this.containerRef=e}},K.createElement("h2",{className:t.srOnly},"Constructed Response Question"),x&&K.createElement("div",{className:t.teacherInstructions},i?k:K.createElement(Z,{labels:{hidden:"Show Teacher Instructions",visible:"Hide Teacher Instructions"},className:t.collapsible},k)),b&&K.createElement(X,{component:"span",className:t.prompt},K.createElement(ee,{defaultClassName:"prompt",prompt:e.prompt})),a?K.createElement(B,{text:E||"",annotations:y||[],comment:_||"",predefinedAnnotations:g||[],onChange:o,onCommentChange:this.changeSessionComment,width:w,height:S,maxHeight:A,disabled:d,disabledMath:!m,customKeys:s,keypadMode:c}):K.createElement(ne,{className:F(t.editor,"response-area-editor"),onChange:this.changeSessionValue,markup:E||"",maxWidth:w&&w.toString(),minWidth:"100px",minHeight:S&&S.toString(),maxHeight:A,disabled:l,highlightShape:!0,toolbarOpts:R,spellCheck:C,charactersLimit:5e4,autoWidthToolbar:!0,pluginProps:{math:{disabled:!m,customKeys:this.props.model.customKeys,keypadMode:this.props.model.equationEditor,controlledKeypadMode:!1},video:{disabled:!0},audio:{disabled:!0},table:{disabled:!0},textAlign:{disabled:!0},separateParagraphs:{disabled:!1},ul_list:{disabled:!0},ol_list:{disabled:!0}},languageCharactersProps:N}),h&&K.createElement(J,{correctness:"correct",feedback:h}))}}ie.__initStatic();var ae=Y((e=>({main:{backgroundColor:Q.background(),color:Q.text()},prompt:{width:"100%",color:Q.text(),marginBottom:2*e.spacing.unit,fontSize:"inherit"},teacherInstructions:{marginBottom:2*e.spacing.unit},editor:{marginBottom:2*e.spacing.unit,borderRadius:"4px"},srOnly:{position:"absolute",left:"-10000px",top:"auto",width:"1px",height:"1px",overflow:"hidden"}})))(ie);const se=e,re=l,{debounce:le}=a,de=s,{renderMath:ce}=d,pe=de("pie-element:extended-text-entry:print");class he extends HTMLElement{constructor(){super(),this._options=null,this._model=null,this._session=[],this._rerender=le((()=>{if(this._model&&this._session){const e=((e,t)=>{const n="instructor"===t.role;return e.prompt=!1!==e.promptEnabled?e.prompt:void 0,e.teacherInstructions=n&&!1!==e.teacherInstructionsEnabled?e.teacherInstructions:void 0,e.showTeacherInstructions=n,e.mode=n?"evaluate":e.mode,e.dimensions={height:100,width:500,...e.dimensions},e.disabled=!0,e.feedback=void 0,e.animationsDisabled=!0,e})(this._model,this._options),t=this._options&&se.createElement(ae,{model:e,session:{},onChange:()=>{},onValueChange:()=>{},onAnnotationsChange:()=>{},onCommentChange:()=>{}});re.render(t,this,(()=>{pe("render complete - render math"),ce(this)}))}else pe("skip")}),50,{leading:!1,trailing:!0})}set options(e){this._options=e}set model(e){this._model=e,this._rerender()}connectedCallback(){}}export{he as default};
|
|
1
|
+
import{_dll_react as e,_dll_classnames as t,_dll_prop_types as n,_dll_material_ui__core as o,_dll_material_ui__core_styles as i,_dll_lodash as a,_dll_debug as s,_dll_pie_lib__render_ui as r,_dll_react_dom as l}from"../../../@pie-lib/shared-module@^1.17.3/module/index.js";import{_dll_pie_lib__math_rendering as d}from"../../../@pie-lib/math-rendering-module@^3.1.3/module/index.js";import{_dll_pie_lib__editable_html as c}from"../../../@pie-lib/editable-html-module@^5.9.3/module/index.js";import{_dll_pie_lib__config_ui as p}from"../../../@pie-lib/config-module@^2.23.1/module/index.js";const h=(e,t,n)=>{const o=n||[],i=o.reduce(((e,t)=>e+t.textContent.length),0);let a=!0;if(i>t)return!1;for(e&&(3===e.nodeType&&e.parentNode&&!e.parentNode.hasAttribute("data-ann-id")&&o.push(e),e=e.firstChild);e&&a;)a=h(e,t,o),e=e.nextSibling;return o},m=e=>{const{commonAncestorContainer:t,startContainer:n,endContainer:o,startOffset:i,endOffset:a}=e,s=[];let r=!1,l=!1,d="";const c=e=>{const{nodeValue:t,childNodes:p}=e;e===n&&e===o?(t&&(d+=t.substring(i,a)),r=l=!0):e===n?(t&&(d+=t.substring(i)),r=!0):e===o?(t&&(d+=t.substring(0,a)),l=!0):e&&3===e.nodeType&&e.parentNode&&!e.parentNode.hasAttribute("data-ann-id")&&t&&r&&!l&&(d+=t,s.push(e)),p.forEach((e=>{l||c(e)}))};return c(t),[s,d]},u=e=>{const t=document.createElement("SPAN");return e.surroundContents(t),t},g=e=>{if(e.startContainer===e.endContainer)return[u(e)];const[t]=m(e),n=document.createRange();n.selectNodeContents(e.startContainer),n.setStart(e.startContainer,e.startOffset);const o=u(n),i=document.createRange();i.selectNode(e.endContainer),i.setEnd(e.endContainer,e.endOffset);const a=u(i);return[o,...t.map((e=>{const t=document.createElement("SPAN");return e.parentNode.insertBefore(t,e),t.appendChild(e),t})),a]},b=(e,t)=>{(e||[]).forEach((e=>{const t=e.parentNode,n=e.childNodes,o=n.length;if(o>0)for(let i=0;i<o;i++)t.insertBefore(n[0],e);else t.insertBefore(document.createTextNode(e.textContent),e);t.removeChild(e)})),t.normalize()},f=()=>{document.getSelection?(document.getSelection().removeAllRanges(),document.getSelection().addRange(document.createRange())):window.getSelection?window.getSelection().removeAllRanges?(window.getSelection().removeAllRanges(),window.getSelection().addRange(document.createRange())):window.getSelection().empty&&window.getSelection().empty():document.selection&&document.selection.empty()},v=e=>e.length>=20||-1!==e.search(/\n|\r|\r\n/),C=e=>Array.from(document.querySelectorAll(`[data-id='${e}']`)),x=e=>document.querySelector(`[data-ann-id='${e}']`),y=e,_=t,E=n,{Popover:w}=o,{TextField:S}=o,{withStyles:A}=i;class R extends y.Component{static __initStatic(){this.propTypes={anchorEl:E.object,open:E.bool,offset:E.number,value:E.string,type:E.string,onClose:E.func,onDelete:E.func,onSave:E.func,onTypeChange:E.func}}constructor(e){super(e),R.prototype.__init.call(this),R.prototype.__init2.call(this),R.prototype.__init3.call(this),this.state={value:e.value}}UNSAFE_componentWillReceiveProps(e){const{value:t}=e,{value:n}=this.props;t!==n&&this.setState({value:t})}__init(){this.onValueChange=e=>this.setState({value:e.target.value})}__init2(){this.handleSave=()=>{const{value:e,onSave:t,onClose:n,onDelete:o}=this.props,{value:i}=this.state;""===i&&o(),e!==i&&t(e,i),this.setState({value:""}),n()}}__init3(){this.handleTypeChange=()=>{const{onTypeChange:e,onDelete:t}=this.props,{value:n}=this.state;""===n?t():e(n),this.setState({value:""})}}render(){const{anchorEl:e,classes:t,offset:n,onDelete:o,open:i,type:a}=this.props,{value:s}=this.state;return y.createElement(w,{anchorEl:e,elevation:2,open:i,onClose:this.handleSave,classes:{paper:_(t.arrow,a)},style:{marginTop:`${n}px`,transition:"margin-top 2s ease-out"},anchorOrigin:{vertical:"top",horizontal:"right"},transformOrigin:{vertical:"top",horizontal:"left"}},y.createElement("div",{className:_(t.wrapper,a)},y.createElement(S,{id:"annotation-editor",style:{padding:"2px 5px",width:"95%"},autoFocus:!0,multiline:!0,rows:1,rowsMax:4,value:s,onChange:this.onValueChange,InputProps:{disableUnderline:!0}}),y.createElement("div",{className:t.holder},y.createElement("div",{className:t.button,onClick:o},"Delete"),y.createElement("div",{className:_(t.button,a),onClick:this.handleTypeChange},"negative"===a?"Green":"Pink"),y.createElement("div",{className:t.button,onClick:this.handleSave},"Save"))))}}R.__initStatic();var k=A((e=>({wrapper:{width:"200px",overflow:"hidden",borderRadius:"4px",backgroundColor:"#ffffff",border:`4px solid ${e.palette.grey[100]}`,"&.negative":{borderColor:"rgb(255, 204, 238) !important"},"&.positive":{borderColor:"rgb(153, 255, 153) !important"}},holder:{display:"flex",flexWrap:"wrap",borderTop:`2px solid ${e.palette.grey[100]}`},positive:{backgroundColor:"rgb(153, 255, 153) !important","&:hover":{filter:"brightness(85%)"}},negative:{backgroundColor:"rgb(255, 204, 238) !important","&:hover":{filter:"brightness(85%)"}},button:{flexGrow:1,width:"28%",textAlign:"center",padding:"4px",cursor:"pointer","&:not(:nth-child(3n))":{borderRight:`1px solid ${e.palette.grey[100]}`},"&:hover":{backgroundColor:e.palette.grey[100]},"&.negative:hover":{backgroundColor:"rgb(153, 255, 153) !important"},"&.positive:hover":{backgroundColor:"rgb(255, 204, 238) !important"}},arrow:{overflowX:"unset",overflowY:"unset",marginLeft:"16px","&::before":{position:"absolute",right:"100%",top:"13px",border:"solid transparent",content:'""',height:0,width:0,pointerEvents:"none",borderWidth:"7px",borderRightColor:e.palette.grey[100]},"&.negative::before":{borderRightColor:"rgb(255, 204, 238) !important"},"&.positive::before":{borderRightColor:"rgb(153, 255, 153) !important"}}})))(R);const N=e,T=t,M=n,{withStyles:I}=i,{Popover:L}=o;class W extends N.Component{static __initStatic(){this.propTypes={anchorEl:M.object,open:M.bool,annotations:M.array,isNewAnnotation:M.bool,onClose:M.func,onDelete:M.func,onEdit:M.func,onWrite:M.func,onAnnotate:M.func}}render(){const{anchorEl:e,annotations:t,classes:n,isNewAnnotation:o,onAnnotate:i,onClose:a,onEdit:s,onDelete:r,onWrite:l,open:d}=this.props;return N.createElement(L,{anchorEl:e,open:d,onClose:a,classes:{paper:n.arrow},elevation:5,anchorOrigin:{vertical:"top",horizontal:"center"},transformOrigin:{vertical:"bottom",horizontal:"center"}},N.createElement("div",{className:n.mainWrapper},N.createElement("div",{className:n.annotationsWrapper},t.map(((e,t)=>N.createElement("div",{key:`annotation-${t}`,className:T(n.button,"positive"===e.type?n.positive:n.negative),onClick:()=>i(e)},e.label)))),N.createElement("div",{className:n.controlsWrapper},N.createElement("div",{className:n.button,onClick:a},"Cancel"),N.createElement("div",{style:{pointerEvents:"none"},className:n.button}),o?N.createElement(N.Fragment,null,N.createElement("div",{className:T(n.button,n.positive),onClick:()=>l("positive")},"Write"),N.createElement("div",{className:T(n.button,n.negative),onClick:()=>l("negative")},"Write")):N.createElement(N.Fragment,null,N.createElement("div",{className:n.button,onClick:r},"Delete"),N.createElement("div",{className:n.button,onClick:s},"Edit")))))}}W.__initStatic();var D=I((e=>({mainWrapper:{width:"300px",overflow:"hidden",borderRadius:"4px",backgroundColor:e.palette.common.white,border:`2px solid ${e.palette.grey[100]}`},annotationsWrapper:{display:"flex",flexWrap:"wrap"},controlsWrapper:{display:"flex",flexWrap:"wrap",borderTop:`2px solid ${e.palette.grey[100]}`},button:{width:"22%",textAlign:"center",padding:"4px",cursor:"pointer",borderBottom:`1px solid ${e.palette.grey[100]}`,"&:not(:nth-child(4n))":{borderRight:`1px solid ${e.palette.grey[100]}`},"&:nth-child(4n)":{flexGrow:1},"&:hover":{backgroundColor:e.palette.grey[100]}},positive:{backgroundColor:"rgb(153, 255, 153) !important","&:hover":{filter:"brightness(85%)"}},negative:{backgroundColor:"rgb(255, 204, 238) !important","&:hover":{filter:"brightness(85%)"}},holder:{display:"flex",flexWrap:"wrap",borderTop:`2px solid ${e.palette.grey[100]}`},arrow:{overflowX:"unset",overflowY:"unset",marginTop:"-16px","&::after":{position:"absolute",left:"calc(50% - 7px)",border:"solid transparent",content:'""',height:0,width:0,pointerEvents:"none",borderWidth:"7px",borderTopColor:"black"}}})))(W);const H=e,{withStyles:P}=i,O=t,$=n,z=c,{InputContainer:j}=p;class q extends H.Component{static __initStatic(){this.propTypes={text:$.string,comment:$.string,annotations:$.array,predefinedAnnotations:$.array,onChange:$.func.isRequired,onCommentChange:$.func.isRequired,width:$.number,height:$.number,maxHeight:$.string,disabled:$.bool,disabledMath:$.bool,customKeys:$.array,keypadMode:$.string,classes:$.object.isRequired}}constructor(e){super(e),q.prototype.__init.call(this),q.prototype.__init2.call(this),q.prototype.__init3.call(this),q.prototype.__init4.call(this),q.prototype.__init5.call(this),q.prototype.__init6.call(this),q.prototype.__init7.call(this),q.prototype.__init8.call(this),q.prototype.__init9.call(this),q.prototype.__init10.call(this),q.prototype.__init11.call(this),q.prototype.__init12.call(this),q.prototype.__init13.call(this),q.prototype.__init14.call(this),q.prototype.__init15.call(this),this.state={anchorEl:null,openedMenu:!1,openedEditor:!1,selectedElems:[],labelElem:null,selectionDetails:null,annotation:null,annotationIndex:null}}componentDidMount(){const{annotations:e,text:t}=this.props;t&&e.forEach((e=>{const[t,n]=((e,t,n)=>{const o=h(n,t),i=[];let a=0;return o.forEach((n=>{const o=a+n.textContent.length;[e,t].forEach((e=>{a<=e&&e<o&&i.push({node:n,offset:e-a})})),a=o})),i})(e.start,e.end,this.textRef);if(t&&n){const o=document.createRange();o.setStart(t.node,t.offset),o.setEnd(n.node,n.offset);const i=g(o);this.createDOMAnnotation(i,e)}})),this.textRef&&(this.adjustAnnotationsPosition(),this.textRef.addEventListener("scroll",this.adjustAnnotationsPosition))}__init(){this.adjustAnnotationsPosition=()=>{if(this.textRef&&this.labelsRef){const e=this.textRef.offsetLeft+this.textRef.offsetWidth+8;Array.from(this.labelsRef.children).forEach((t=>{const n=C(t.dataset.annId),o=(n[0].offsetTop?n[0].offsetTop:n[0].offsetParent.offsetTop)-this.textRef.scrollTop-6;t.style.top=`${o}px`,t.style.left=`${e}px`}))}}}__init2(){this.handleClick=e=>{const{annotations:t,classes:n}=this.props,{selectionDetails:o}=this.state;if(o)return;const{id:i,annId:a}=e.target.dataset,s=i||a,r=C(s),l=x(s),d=t.findIndex((e=>e.id===s)),c=l.hasAttribute("data-freeform");c&&l.classList.add(n.highlight),this.setState({anchorEl:r[0],openedMenu:!!i||!!a&&!c,openedEditor:!!a&&c,selectedElems:r,labelElem:l,annotationIndex:d,annotation:t[d],selectionDetails:null})}}__init3(){this.handleHover=e=>{const{classes:t}=this.props,{id:n,annId:o}=e.target.dataset,i=n||o,a=C(i),s=x(i),r=s.hasAttribute("data-freeform");a.forEach((e=>e.classList.add(t.hover))),s.classList.add(r?t.sideAnnotationHover:t.labelHover)}}__init4(){this.handleCancelHover=e=>{const{classes:t}=this.props,{id:n,annId:o}=e.target.dataset,i=n||o,a=C(i),s=x(i),r=s.hasAttribute("data-freeform");a.forEach((e=>e.classList.remove(t.hover))),s.classList.remove(r?t.sideAnnotationHover:t.labelHover)}}__init5(){this.handleClose=e=>{const{classes:t}=this.props,{selectedElems:n,labelElem:o}=this.state;n.length&&!n[0].hasAttribute("data-id")&&b(n,this.textRef),o&&o.classList.remove(t.highlight),this.setState({anchorEl:null,openedMenu:!1,openedEditor:!1,selectedElems:[],labelElem:null,selectionDetails:null,annotationIndex:null,annotation:null}),f()}}__init6(){this.handleSelection=e=>{const t=window.getSelection();if(e.detail>2)f();else if(t&&t.rangeCount>0){const e=t.getRangeAt(0),n=e.toString(),o=this.textRef.contains(e.commonAncestorContainer);if(!t.isCollapsed&&""!==n&&o){const t=((e,t)=>{const n=document.createRange();n.setStart(t,0),n.setEnd(e.startContainer,e.startOffset);const[,o]=m(n),[,i]=m(e),a=o.length;return{quote:i,start:a,end:a+i.length}})(e,this.textRef),n=g(e);this.setState({anchorEl:n[0],openedMenu:!0,selectedElems:n,selectionDetails:t})}}}}__init7(){this.deleteAnnotation=()=>{const{annotations:e,onChange:t}=this.props,{selectedElems:n,labelElem:o,annotationIndex:i,annotation:a}=this.state;(v(a.label)?this.labelsRef:n[0]).removeChild(o),b(n,this.textRef),e.splice(i,1),t(e),this.handleClose()}}__init8(){this.createDOMAnnotation=(e,t)=>{const{classes:n,disabled:o}=this.props,{id:i,label:a,type:s}=t;(e||[]).forEach((e=>{e.dataset.id=i,e.className=O(n.annotation,s),e.onclick=!o&&this.handleClick,e.onmouseover=this.handleHover,e.onmouseout=this.handleCancelHover}));const r=e&&e[0]||{},l=document.createElement("SPAN");if(l.dataset.annId=i,l.innerHTML=a,l.onclick=!o&&this.handleClick,l.onmouseover=this.handleHover,l.onmouseout=this.handleCancelHover,v(a)){const e=(r.offsetTop?r.offsetTop:r.offsetParent.offsetTop)-this.textRef.scrollTop,t=this.textRef.offsetLeft+this.textRef.offsetWidth+8;l.dataset.freeform=!0,l.className=O(n.sideAnnotation,s),l.style.top=`${e}px`,l.style.left=`${t}px`,this.labelsRef.appendChild(l)}else l.className=O(n.annotationLabel,s),r.appendChild(l)}}__init9(){this.createNewAnnotation=(e,t)=>{const{selectedElems:n,selectionDetails:o}=this.state,i={id:[o.start,o.end,(new Date).getTime()].join("-"),label:e,type:t,...o};return this.createDOMAnnotation(n,i),i}}__init10(){this.handleMenuClick=e=>{const{annotations:t,onChange:n}=this.props,{annotation:o,annotationIndex:i}=this.state,{type:a,text:s}=e;if(o){const e={...o,label:s,type:a},{type:n,label:r}=o;this.updateLabel(r,e,a!==n&&n),t.splice(i,1,e)}else{const e=this.createNewAnnotation(s,a);t.push(e)}n(t),this.handleClose()}}__init11(){this.editAnnotation=()=>{this.setState({openedMenu:!1,openedEditor:!0})}}__init12(){this.addAnnotation=e=>{const{annotations:t,onChange:n}=this.props,o=this.createNewAnnotation("",e),i=x(o.id);t.push(o),this.setState({openedMenu:!1,openedEditor:!0,annotationIndex:t.length-1,annotation:o,labelElem:i}),n(t)}}__init13(){this.updateLabel=(e,t,n)=>{const{selectedElems:o,labelElem:i}=this.state,{label:a,type:s}=t;v(a)&&v(e)||!v(a)&&!v(e)?(i.innerHTML=a,n&&(i.classList.remove(n),i.classList.add(s),o.forEach((e=>{e.classList.remove(n),e.classList.add(s)})))):v(a)&&!v(e)?(o[0].removeChild(i),this.createDOMAnnotation(o,t)):!v(a)&&v(e)&&(this.labelsRef.removeChild(i),this.createDOMAnnotation(o,t))}}__init14(){this.changeAnnotationType=e=>{const{annotations:t,onChange:n}=this.props,{annotationIndex:o,selectedElems:i}=this.state,{type:a,label:s}=t[o],r="positive"===a?"negative":"positive",l={...t[o],type:r,label:e};i.forEach((e=>{e.classList.remove(a),e.classList.add(r)})),this.updateLabel(s,l,a),t.splice(o,1,l),n(t),this.handleClose()}}__init15(){this.updateAnnotation=(e,t)=>{const{annotations:n,onChange:o}=this.props,{annotationIndex:i}=this.state,a={...n[i],label:t};this.updateLabel(e,a),n.splice(i,1,a),o(n)}}componentWillUnmount(){this.textRef.removeEventListener("scroll",this.adjustAnnotationsPosition)}render(){const{classes:e,comment:t,customKeys:n,disabled:o,disabledMath:i,keypadMode:a,height:s,width:r,maxHeight:l,onCommentChange:d,predefinedAnnotations:c,text:p}=this.props,{anchorEl:h,annotation:m,openedMenu:u,openedEditor:g,selectionDetails:b}=this.state,v=h&&(h.offsetTop?h.offsetTop:h.offsetParent.offsetTop),C=this.textRef&&v?v-this.textRef.scrollTop-8:0;return H.createElement("div",null,H.createElement("div",{className:e.wrapper},H.createElement("div",{className:e.textContainer,style:{width:r-34,minHeight:s,maxHeight:l},ref:e=>this.textRef=e,onMouseDown:o?()=>{}:f,onMouseUp:o?()=>{}:this.handleSelection,dangerouslySetInnerHTML:{__html:p}}),H.createElement("div",{className:e.labelsContainer,ref:e=>this.labelsRef=e})),H.createElement(j,{label:"Comment",className:e.commentContainer},H.createElement(z,{className:e.prompt,markup:t||"",onChange:d,width:r&&(r+104).toString(),disabled:o,pluginProps:{math:{disabled:i,customKeys:n,keypadMode:a,controlledKeypadMode:!1},video:{disabled:!0},audio:{disabled:!0},textAlign:{disabled:!0}}})),H.createElement(D,{anchorEl:h,open:u&&!o,annotations:c,isNewAnnotation:!!b,onClose:this.handleClose,onDelete:this.deleteAnnotation,onEdit:this.editAnnotation,onWrite:this.addAnnotation,onAnnotate:this.handleMenuClick}),H.createElement(k,{anchorEl:this.textRef,open:g&&!o,offset:C,value:m&&m.label||"",type:m&&m.type,onClose:this.handleClose,onDelete:this.deleteAnnotation,onSave:this.updateAnnotation,onTypeChange:this.changeAnnotationType}))}}q.__initStatic();var B=P((e=>({textContainer:{padding:"10px 120px 10px 16px",backgroundColor:"rgba(0, 0, 0, 0.06)",border:"1px solid #ccc",borderRadius:"4px",overflowY:"scroll",lineHeight:"36px",whiteSpace:"pre-wrap",overflowWrap:"break-word","& p":{margin:0},"& span[data-latex]":{userSelect:"none","-webkit-user-select":"none","-moz-user-select":"none","-ms-user-select":"none"}},labelsContainer:{width:"230px"},wrapper:{position:"relative",overflowX:"hidden",display:"flex"},commentContainer:{paddingTop:2*e.spacing.unit,marginBottom:2*e.spacing.unit,marginTop:2*e.spacing.unit,width:"100%"},annotation:{position:"relative",cursor:"pointer","&.positive":{backgroundColor:"rgb(51, 255, 51, 0.5)"},"&.negative":{backgroundColor:"rgba(255, 102, 204, 0.4)"}},annotationLabel:{backgroundColor:"rgb(242, 242, 242)",padding:"2px",position:"absolute",userSelect:"none",whiteSpace:"nowrap",top:"-10px",left:"-2px",fontSize:e.typography.fontSize-2,fontStyle:"normal",fontWeight:"normal",lineHeight:"6px","-webkit-user-select":"none","-moz-user-select":"none","-ms-user-select":"none","&.positive":{color:"rgb(0, 128, 0)"},"&.negative":{color:"rgb(204, 0, 136)"}},labelHover:{zIndex:20,"&.positive":{color:"rgb(0, 77, 0)"},"&.negative":{color:"rgb(153, 0, 102)"}},highlight:{zIndex:10},hover:{zIndex:20,"&.positive":{backgroundColor:"rgb(51, 255, 51, 0.7)"},"&.negative":{backgroundColor:"rgba(255, 102, 204, 0.55)"}},sideAnnotationHover:{zIndex:20,"&.negative":{backgroundColor:"rgb(255, 179, 230) !important","&:before":{borderRightColor:"rgb(255, 179, 230) !important"}},"&.positive":{backgroundColor:"rgb(128, 255, 128) !important","&:before":{borderRightColor:"rgb(153, 255, 153) !important"}}},sideAnnotation:{position:"absolute",padding:e.spacing.unit/2,borderRadius:"4px",marginLeft:e.spacing.unit,width:"180px",whiteSpace:"pre-wrap",wordBreak:"break-word",border:`2px solid ${e.palette.common.white}`,fontSize:e.typography.fontSize,fontStyle:"normal",fontWeight:"normal","&:before":{position:"absolute",right:"100%",top:"5px",border:"solid transparent",content:'""',height:0,width:0,pointerEvents:"none",borderWidth:"7px"},"&.negative":{backgroundColor:"rgb(255, 204, 238)","&:before":{borderRightColor:"rgb(255, 204, 238)"}},"&.positive":{backgroundColor:"rgb(153, 255, 153)","&:before":{borderRightColor:"rgb(153, 255, 153)"}}}})))(q);const K=e,V=n,F=t,{debounce:U}=a,G=s,{Typography:X}=o,{withStyles:Y}=i,{color:Q}=r,{Feedback:J}=r,{Collapsible:Z}=r,{PreviewPrompt:ee}=r,{UiLayout:te}=r,ne=c,oe=G("@pie-ui:extended-text-entry");class ie extends K.Component{constructor(...e){super(...e),ie.prototype.__init.call(this),ie.prototype.__init2.call(this)}static __initStatic(){this.propTypes={onValueChange:V.func.isRequired,onAnnotationsChange:V.func.isRequired,onCommentChange:V.func.isRequired,model:V.object,classes:V.object.isRequired,session:V.shape({value:V.string,annotations:V.array,comment:V.string}).isRequired}}__init(){this.changeSessionValue=U(this.props.onValueChange,1500)}__init2(){this.changeSessionComment=U(this.props.onCommentChange,1500)}render(){const{model:e,classes:t,session:n,onAnnotationsChange:o}=this.props,{animationsDisabled:i,annotatorMode:a,customKeys:s,dimensions:r,disabled:l,disabledAnnotator:d,equationEditor:c,extraCSSRules:p,feedback:h,mathInput:m,playersToolbarPosition:u,predefinedAnnotations:g,prompt:b,spanishInput:f,specialInput:v,spellCheckEnabled:C,teacherInstructions:x}=e,{annotations:y,comment:_,value:E}=n,{width:w,height:S}=r||{},A="40vh",R={position:"top"===u?"top":"bottom"};oe("[render] disabled? ",l);const k=K.createElement(ee,{defaultClassName:"teacher-instructions",prompt:x}),N=[];return f&&N.push({language:"spanish"}),v&&N.push({language:"special"}),K.createElement(te,{extraCSSRules:p,className:t.main,ref:e=>{this.containerRef=e}},K.createElement("h2",{className:t.srOnly},"Constructed Response Question"),x&&K.createElement("div",{className:t.teacherInstructions},i?k:K.createElement(Z,{labels:{hidden:"Show Teacher Instructions",visible:"Hide Teacher Instructions"},className:t.collapsible},k)),b&&K.createElement(X,{component:"span",className:t.prompt},K.createElement(ee,{defaultClassName:"prompt",prompt:e.prompt})),a?K.createElement(B,{text:E||"",annotations:y||[],comment:_||"",predefinedAnnotations:g||[],onChange:o,onCommentChange:this.changeSessionComment,width:w,height:S,maxHeight:A,disabled:d,disabledMath:!m,customKeys:s,keypadMode:c}):K.createElement(ne,{className:F(t.editor,"response-area-editor"),onChange:this.changeSessionValue,markup:E||"",maxWidth:w&&w.toString(),minWidth:"100px",minHeight:S&&S.toString(),maxHeight:A,disabled:l,highlightShape:!0,toolbarOpts:R,spellCheck:C,charactersLimit:5e4,autoWidthToolbar:!0,pluginProps:{math:{disabled:!m,customKeys:this.props.model.customKeys,keypadMode:this.props.model.equationEditor,controlledKeypadMode:!1},video:{disabled:!0},audio:{disabled:!0},table:{disabled:!0},textAlign:{disabled:!0},separateParagraphs:{disabled:!1}},languageCharactersProps:N}),h&&K.createElement(J,{correctness:"correct",feedback:h}))}}ie.__initStatic();var ae=Y((e=>({main:{backgroundColor:Q.background(),color:Q.text()},prompt:{width:"100%",color:Q.text(),marginBottom:2*e.spacing.unit,fontSize:"inherit"},teacherInstructions:{marginBottom:2*e.spacing.unit},editor:{marginBottom:2*e.spacing.unit,borderRadius:"4px"},srOnly:{position:"absolute",left:"-10000px",top:"auto",width:"1px",height:"1px",overflow:"hidden"}})))(ie);const se=e,re=l,{debounce:le}=a,de=s,{renderMath:ce}=d,pe=de("pie-element:extended-text-entry:print");class he extends HTMLElement{constructor(){super(),this._options=null,this._model=null,this._session=[],this._rerender=le((()=>{if(this._model&&this._session){const e=((e,t)=>{const n="instructor"===t.role;return e.prompt=!1!==e.promptEnabled?e.prompt:void 0,e.teacherInstructions=n&&!1!==e.teacherInstructionsEnabled?e.teacherInstructions:void 0,e.showTeacherInstructions=n,e.mode=n?"evaluate":e.mode,e.dimensions={height:100,width:500,...e.dimensions},e.disabled=!0,e.feedback=void 0,e.animationsDisabled=!0,e})(this._model,this._options),t=this._options&&se.createElement(ae,{model:e,session:{},onChange:()=>{},onValueChange:()=>{},onAnnotationsChange:()=>{},onCommentChange:()=>{}});re.render(t,this,(()=>{pe("render complete - render math"),ce(this)}))}else pe("skip")}),50,{leading:!1,trailing:!0})}set options(e){this._options=e}set model(e){this._model=e,this._rerender()}connectedCallback(){}}export{he as default};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@pie-element/extended-text-entry",
|
|
3
|
-
"version": "13.3.3-next.
|
|
3
|
+
"version": "13.3.3-next.2+5b9317eeb",
|
|
4
4
|
"description": "",
|
|
5
5
|
"repository": "pie-framework/pie-elements",
|
|
6
6
|
"publishConfig": {
|
|
@@ -12,10 +12,10 @@
|
|
|
12
12
|
"@material-ui/core": "^3.9.2",
|
|
13
13
|
"@material-ui/icons": "^3.0.2",
|
|
14
14
|
"@pie-framework/pie-player-events": "^0.1.0",
|
|
15
|
-
"@pie-lib/config-ui": "11.30.
|
|
16
|
-
"@pie-lib/editable-html": "11.21.
|
|
17
|
-
"@pie-lib/math-rendering": "3.22.1",
|
|
18
|
-
"@pie-lib/render-ui": "4.35.
|
|
15
|
+
"@pie-lib/config-ui": "^11.30.1",
|
|
16
|
+
"@pie-lib/editable-html": "^11.21.1",
|
|
17
|
+
"@pie-lib/math-rendering": "^3.22.1",
|
|
18
|
+
"@pie-lib/render-ui": "^4.35.1",
|
|
19
19
|
"classnames": "^2.2.5",
|
|
20
20
|
"debug": "^4.1.1",
|
|
21
21
|
"lodash.throttle": "^4.1.1",
|
|
@@ -23,7 +23,7 @@
|
|
|
23
23
|
"react": "^16.8.1",
|
|
24
24
|
"react-dom": "^16.8.1"
|
|
25
25
|
},
|
|
26
|
-
"gitHead": "
|
|
26
|
+
"gitHead": "5b9317eeb625934bac34f761719d9cdb4cf5b4ab",
|
|
27
27
|
"scripts": {
|
|
28
28
|
"postpublish": "../../scripts/postpublish"
|
|
29
29
|
},
|