@pie-element/extended-text-entry 13.1.0 → 13.2.0

package/CHANGELOG.md

@@ -3,6 +3,17 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [13.2.0](https://github.com/pie-framework/pie-elements/compare/@pie-element/extended-text-entry@13.0.0...@pie-element/extended-text-entry@13.2.0) (2025-10-10)
+
+
+### Features
+
+* update libs PD-5208, PD-5211, PD-5199, PD-5218, PD-5217 ([da327fa](https://github.com/pie-framework/pie-elements/commit/da327fa501f6e9eff1c0b30b5ef092426a91f78b))
+
+
+
+
+
 # [13.1.0](https://github.com/pie-framework/pie-elements/compare/@pie-element/extended-text-entry@12.0.0...@pie-element/extended-text-entry@13.1.0) (2025-10-07)
 
 **Note:** Version bump only for package @pie-element/extended-text-entry

package/configure/CHANGELOG.md

@@ -3,6 +3,17 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [11.2.0](https://github.com/pie-framework/pie-elements/compare/@pie-element/extended-text-entry-configure@11.0.1...@pie-element/extended-text-entry-configure@11.2.0) (2025-10-10)
+
+
+### Features
+
+* update libs PD-5208, PD-5211, PD-5199, PD-5218, PD-5217 ([da327fa](https://github.com/pie-framework/pie-elements/commit/da327fa501f6e9eff1c0b30b5ef092426a91f78b))
+
+
+
+
+
 # [11.1.0](https://github.com/pie-framework/pie-elements/compare/@pie-element/extended-text-entry-configure@11.0.0...@pie-element/extended-text-entry-configure@11.1.0) (2025-10-07)
 
 **Note:** Version bump only for package @pie-element/extended-text-entry-configure

package/configure/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@pie-element/extended-text-entry-configure",
   "private": true,
-  "version": "11.1.0",
+  "version": "11.2.0",
   "description": "",
   "main": "lib/index.js",
   "module": "src/index.js",
@@ -10,8 +10,8 @@
   "dependencies": {
     "@material-ui/core": "^3.9.2",
     "@pie-framework/pie-configure-events": "^1.3.0",
-    "@pie-lib/config-ui": "^11.25.0",
-    "@pie-lib/editable-html": "^11.17.0",
+    "@pie-lib/config-ui": "^11.25.1",
+    "@pie-lib/editable-html": "^11.17.1",
     "lodash": "^4.17.15",
     "prop-types": "^15.6.2",
     "react": "^16.8.1",

package/controller/CHANGELOG.md

@@ -3,6 +3,17 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [7.2.0](https://github.com/pie-framework/pie-elements/compare/@pie-element/extended-text-entry-controller@7.0.1...@pie-element/extended-text-entry-controller@7.2.0) (2025-10-10)
+
+
+### Features
+
+* update libs PD-5208, PD-5211, PD-5199, PD-5218, PD-5217 ([da327fa](https://github.com/pie-framework/pie-elements/commit/da327fa501f6e9eff1c0b30b5ef092426a91f78b))
+
+
+
+
+
 # [7.1.0](https://github.com/pie-framework/pie-elements/compare/@pie-element/extended-text-entry-controller@7.0.0...@pie-element/extended-text-entry-controller@7.1.0) (2025-10-07)
 
 **Note:** Version bump only for package @pie-element/extended-text-entry-controller

package/controller/package.json

@@ -1,12 +1,12 @@
 {
   "name": "@pie-element/extended-text-entry-controller",
   "private": true,
-  "version": "7.1.0",
+  "version": "7.2.0",
   "description": "",
   "main": "lib/index.js",
   "module": "src/index.js",
   "dependencies": {
-    "@pie-lib/feedback": "^0.20.0"
+    "@pie-lib/feedback": "^0.21.4"
   },
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1"

package/module/configure.js

@@ -0,0 +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.14.5/module/index.js";import{_dll_pie_lib__config_ui as s}from"../../../@pie-lib/config-module@^2.19.5/module/index.js";import{_dll_pie_lib__editable_html as o}from"../../../@pie-lib/editable-html-module@^5.6.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};

package/module/controller.js

@@ -0,0 +1,140 @@
+/**
+ * Get the feedback from a {FeedbackConfig}
+ *
+ * @param {FeedbackConfig} feedback
+ * @param {string} fallback
+ */
+
+const getFeedback = (feedback, fallback) => new Promise(resolve => {
+  if (!feedback || feedback.type === 'none') {
+    resolve(undefined);
+    return;
+  }
+
+  feedback = feedback || {};
+  const out = feedback[feedback.type] || fallback;
+  resolve(out);
+}); // TODO: should replace getFeedbackForCorrectness
+
+var defaults = {
+  annotationsEnabled: false,
+  dimensions: { height: 100, width: 500 },
+  equationEditor: 'Grade 8 - HS',
+  feedbackEnabled: false,
+  mathInput: false,
+  playerSpellCheckDisabled: true,
+  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: true,
+  rationale: '',
+  rationaleEnabled: true,
+  studentInstructionsEnabled: true,
+  teacherInstructions: '',
+  teacherInstructionsEnabled: true,
+  toolbarEditorPosition: 'bottom',
+};
+
+async function createDefaultModel(model = {}) {
+
+  return { ...defaults, ...model };
+}
+
+const normalize = (question) => ({ ...defaults, ...question });
+
+async function model(question, session, env) {
+  const normalizedQuestion = normalize(question);
+
+  const fb =
+    env.mode === 'evaluate' && normalizedQuestion.feedbackEnabled
+      ? getFeedback(normalizedQuestion.feedback, 'Your answer has been submitted')
+      : Promise.resolve(undefined);
+
+  let teacherInstructions = null;
+  if (env.role === 'instructor' && (env.mode === 'view' || env.mode === 'evaluate')) {
+    teacherInstructions = normalizedQuestion.teacherInstructionsEnabled ? normalizedQuestion.teacherInstructions : null;
+  } else {
+    teacherInstructions = null;
+  }
+
+  let equationEditor = normalizedQuestion.equationEditor || 'miscellaneous';
+
+  switch (normalizedQuestion.equationEditor) {
+    case 'Grade 1 - 2':
+      equationEditor = 1;
+      break;
+    case 'Grade 3 - 5':
+      equationEditor = 3;
+      break;
+    case 'Grade 6 - 7':
+      equationEditor = 6;
+      break;
+    case 'Grade 8 - HS':
+      equationEditor = 8;
+      break;
+  }
+
+  const annotatorMode = normalizedQuestion.annotationsEnabled && (env.role === 'instructor' || env.mode === 'evaluate');
+
+  return fb.then((feedback) => ({
+    prompt: normalizedQuestion.promptEnabled ? normalizedQuestion.prompt : null,
+    dimensions: normalizedQuestion.dimensions,
+    customKeys: normalizedQuestion.customKeys || [],
+    id: normalizedQuestion.id,
+    disabled: env.mode !== 'gather',
+    feedback,
+    teacherInstructions,
+    language: normalizedQuestion.language,
+    mathInput: normalizedQuestion.mathInput,
+    spanishInput: normalizedQuestion.spanishInput,
+    specialInput: normalizedQuestion.specialInput,
+    equationEditor,
+    spellCheckEnabled: !normalizedQuestion.playerSpellCheckDisabled,
+    playersToolbarPosition: normalizedQuestion.playersToolbarPosition || 'bottom',
+    annotatorMode,
+    disabledAnnotator: normalizedQuestion.annotationsEnabled ? env.role !== 'instructor' : true,
+    predefinedAnnotations: normalizedQuestion.annotationsEnabled ? normalizedQuestion.predefinedAnnotations : [],
+    extraCSSRules: normalizedQuestion.extraCSSRules,
+  }));
+}
+
+async function outcome(/*question, session, env*/) {
+  return {
+    score: 0,
+    completed: 'n/a',
+    note: 'Requires manual scoring',
+  };
+}
+
+// remove all html tags except img, iframe and source tag for audio
+const getContent = (html) => (html || '').replace(/(<(?!img|iframe|source)([^>]+)>)/gi, '');
+
+const validate = (model = {}, config = {}) => {
+  const errors = {};
+
+  ['teacherInstructions', 'prompt'].forEach((field) => {
+    if (config[field]?.required && !getContent(model[field])) {
+      errors[field] = 'This field is required.';
+    }
+  });
+
+  return errors;
+};
+
+export { createDefaultModel, model, normalize, outcome, validate };

package/module/demo.js

@@ -0,0 +1,38 @@
+import Configure from './configure.js';
+import Element from './element.js';
+import * as controller from './controller.js';
+
+var generate = {};
+
+generate.model = (id, element) => ({
+  id,
+  element,
+  customKeys: ['\\square'],
+  feedback: { type: 'default', default: 'this is default feedback' },
+  prompt: 'This is the question prompt',
+  promptEnabled: true,
+  mathInput: true,
+  playersToolbarPosition: 'bottom',
+  toolbarEditorPosition: 'bottom',
+  spellCheckEnabled: true,
+  rubricEnabled: false,
+  annotationsEnabled: false,
+});
+
+const { model } = generate;
+var config = {
+  elements: {
+    'extended-text-entry': '../..',
+  },
+  models: [model('1', 'extended-text-entry')],
+};
+
+//Note: demo-el is a custom element loaded in the markup.
+  customElements.whenDefined("demo-el").then(() => {
+    config.models.forEach((m) => {
+      const de = document.createElement("demo-el");
+      document.body.appendChild(de);
+      de.def = { tagName: m.element, Element, Configure, controller };
+      de.model = m;
+    });
+  });