@pie-element/passage 7.2.0 → 7.2.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +6 -0
- package/configure/CHANGELOG.md +6 -0
- package/configure/package.json +3 -3
- package/module/configure.js +1 -1
- package/module/element.js +1 -1
- package/module/index.html +1 -1
- package/module/manifest.json +2 -2
- package/module/print.html +1 -1
- package/module/print.js +1 -1
- package/package.json +2 -2
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,12 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
## [7.2.1](https://github.com/pie-framework/pie-elements/compare/@pie-element/passage@7.2.0...@pie-element/passage@7.2.1) (2026-06-17)
|
|
7
|
+
|
|
8
|
+
### Bug Fixes
|
|
9
|
+
|
|
10
|
+
- bump shared modules and libs PIE-661 PIE-664 PIE-683 PIE-666 PIE-656 PIE-657 PIE-658 PIE-659 PIE-670 ([ebd6be4](https://github.com/pie-framework/pie-elements/commit/ebd6be4fd48fca41ad4c4908f606b25334731aed))
|
|
11
|
+
|
|
6
12
|
# [7.2.0](https://github.com/pie-framework/pie-elements/compare/@pie-element/passage@7.1.2...@pie-element/passage@7.2.0) (2026-06-12)
|
|
7
13
|
|
|
8
14
|
### Bug Fixes
|
package/configure/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,12 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
## [5.1.4](https://github.com/pie-framework/pie-elements/compare/@pie-element/passage-configure@5.1.3...@pie-element/passage-configure@5.1.4) (2026-06-17)
|
|
7
|
+
|
|
8
|
+
### Bug Fixes
|
|
9
|
+
|
|
10
|
+
- bump shared modules and libs PIE-661 PIE-664 PIE-683 PIE-666 PIE-656 PIE-657 PIE-658 PIE-659 PIE-670 ([ebd6be4](https://github.com/pie-framework/pie-elements/commit/ebd6be4fd48fca41ad4c4908f606b25334731aed))
|
|
11
|
+
|
|
6
12
|
## [5.1.3](https://github.com/pie-framework/pie-elements/compare/@pie-element/passage-configure@5.1.2...@pie-element/passage-configure@5.1.3) (2026-06-12)
|
|
7
13
|
|
|
8
14
|
### Bug Fixes
|
package/configure/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@pie-element/passage-configure",
|
|
3
3
|
"private": true,
|
|
4
|
-
"version": "5.1.
|
|
4
|
+
"version": "5.1.4",
|
|
5
5
|
"description": "",
|
|
6
6
|
"main": "lib/index.js",
|
|
7
7
|
"module": "src/index.js",
|
|
@@ -13,8 +13,8 @@
|
|
|
13
13
|
"@mui/icons-material": "^7.3.4",
|
|
14
14
|
"@mui/material": "^7.3.4",
|
|
15
15
|
"@pie-framework/pie-configure-events": "^1.3.0",
|
|
16
|
-
"@pie-lib/config-ui": "13.0.
|
|
17
|
-
"@pie-lib/editable-html-tip-tap": "2.1.
|
|
16
|
+
"@pie-lib/config-ui": "13.0.8",
|
|
17
|
+
"@pie-lib/editable-html-tip-tap": "2.1.6",
|
|
18
18
|
"lodash-es": "^4.17.23",
|
|
19
19
|
"prop-types": "^15.8.1",
|
|
20
20
|
"react": "18.3.1",
|
package/module/configure.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{_dll_prop_types as e,_dll_mui__material_styles as t,_dll_react as a,_dll_mui__material as n,_dll_mui__icons_material as i,_dll_react_dom_client as s}from"../../../@pie-lib/shared-module@^5.2.5/module/index.js";import{_dll_pie_lib__config_ui as l}from"../../../@pie-lib/config-module@^4.0.10/module/index.js";import{_dll_pie_lib__editable_html_tip_tap as o}from"../../../@pie-lib/editable-html-module@^7.1.7/module/index.js";var r={};Object.defineProperty(r,"__esModule",{value:!0});class d extends CustomEvent{constructor(e,t=!1){super(d.TYPE,{bubbles:!0,detail:{update:e,reset:t}}),this.update=e,this.reset=t}}d.TYPE="model.updated";var u=r.ModelUpdatedEvent=d;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 g=r.DeleteImageEvent=c;class p extends CustomEvent{constructor(e){super(p.TYPE,{bubbles:!0,detail:e}),this.handler=e}}p.TYPE="insert.image";var h=r.InsertImageEvent=p;class m extends CustomEvent{constructor(e,t){super(m.TYPE,{bubbles:!0,detail:{src:e,done:t}}),this.src=e,this.done=t}}m.TYPE="delete.sound";var b=r.DeleteSoundEvent=m;class _ extends CustomEvent{constructor(e){super(_.TYPE,{bubbles:!0,detail:e}),this.handler=e}}_.TYPE="insert.sound";var C=r.InsertSoundEvent=_;const E=a,f=e,{styled:x}=t,{Button:S}=n,{Dialog:I}=n,{DialogTitle:v}=n,{DialogContent:P}=n,{DialogContentText:y}=n,{DialogActions:T}=n,{RemoveCircle:R}=i,{AddCircle:q}=i,D=x(({label:e,type:t="add",onClick:a})=>{const n="add"===t?q:R;return E.createElement(S,{color:"primary",size:"small",onClick:a},E.createElement(n,{fontSize:"small",color:"primary",style:{marginRight:4}}),e)})({textDecoration:"underline","&:hover":{textDecoration:"underline",backgroundColor:"transparent"},display:"flex",alignItems:"center"}),k=({content:e,cancel:t,title:a,ok:n,open:i,onOk:s,onCancel:l})=>E.createElement(I,{open:i},E.createElement(v,null,a),E.createElement(P,null,E.createElement(y,null,e)),E.createElement(T,null,s&&E.createElement(S,{onClick:s,color:"primary"},n),l&&E.createElement(S,{onClick:l,color:"primary"},t)));k.propTypes={content:f.string.isRequired,title:f.string.isRequired,cancel:f.string.isRequired,ok:f.string.isRequired,open:f.bool.isRequired,onCancel:f.func.isRequired,onOk:f.func.isRequired};const A=a,M=e,{styled:w}=t,{InputContainer:j}=l,O=o,{ALL_PLUGINS:Y}=o;function L(e){let t,a=e[0],n=1;for(;n<e.length;){const i=e[n],s=e[n+1];if(n+=2,("optionalAccess"===i||"optionalCall"===i)&&null==a)return;"access"===i||"optionalAccess"===i?(t=a,a=s(a)):"call"!==i&&"optionalCall"!==i||(a=s((...e)=>a.call(t,...e)),t=void 0)}return a}const H=w(j)(({theme:e})=>({paddingTop:e.spacing(2),marginBottom:e.spacing(2),width:"100%"})),W=w("div")(({theme:e})=>({fontSize:e.typography.fontSize-2,color:e.palette.error.main,paddingTop:e.spacing(1)}));class z extends A.Component{static __initStatic(){this.propTypes={onModelChanged:M.func.isRequired,model:M.object.isRequired,configuration:M.object.isRequired,imageSupport:M.object.isRequired,passageIndex:M.number.isRequired,uploadSoundSupport:M.object.isRequired}}static __initStatic2(){this.defaultProps={passageIndex:0}}constructor(e){super(e),z.prototype.__init.call(this)}__init(){this.handleChange=(e,t)=>{const{model:a,onModelChanged:n,passageIndex:i}=this.props;if(!a.passages||i<0||i>=a.passages.length)return;const s=[...a.passages];s[i]={...s[i],[e]:t},n({...a,passages:s})}}render(){const{model:e,configuration:t,imageSupport:a,passageIndex:n,uploadSoundSupport:i}=this.props,{maxImageWidth:s={},maxImageHeight:l={},mathMlOptions:o={},baseInputConfiguration:r={},teacherInstructions:d={},title:u={},subtitle:c={},text:g={},author:p={}}=t||{},{errors:h={},passages:m=[],teacherInstructionsEnabled:b,titleEnabled:_,subtitleEnabled:C,authorEnabled:E,textEnabled:f}=e||{},{passages:x}=h||{},{teacherInstructions:S,title:I,subtitle:v,author:P,text:y}=x&&x[n]||{},T=s&&s.prompt,R=l&&l.prompt,q=e=>({...r,...e}),D=(Y||[]).filter(e=>!["math","table","bulleted-list","numbered-list"].includes(e));return A.createElement(A.Fragment,null,b&&A.createElement(H,{label:d.label},A.createElement(O,{activePlugins:Y,markup:m[n].teacherInstructions||"",onChange:e=>this.handleChange("teacherInstructions",e),nonEmpty:!1,error:S,maxImageWidth:s&&s.teacherInstructions||T,maxImageHeight:l&&l.teacherInstructions||R,mathMlOptions:o,languageCharactersProps:[{language:"spanish"},{language:"special"}],pluginProps:q(L([d,"optionalAccess",e=>e.inputConfiguration]))}),S&&A.createElement(W,null,S)),_&&A.createElement(H,{label:u.label},A.createElement(O,{activePlugins:D,markup:m[n].title||"",onChange:e=>this.handleChange("title",e),nonEmpty:!1,error:I,mathMlOptions:o,languageCharactersProps:[{language:"spanish"},{language:"special"}],pluginProps:q(L([u,"optionalAccess",e=>e.inputConfiguration]))}),I&&A.createElement(W,null,I)),C&&A.createElement(H,{label:c.label},A.createElement(O,{activePlugins:D,markup:m[n].subtitle||"",onChange:e=>this.handleChange("subtitle",e),nonEmpty:!1,error:v,mathMlOptions:o,languageCharactersProps:[{language:"spanish"},{language:"special"}],pluginProps:q(L([c,"optionalAccess",e=>e.inputConfiguration]))}),v&&A.createElement(W,null,v)),E&&A.createElement(H,{label:p.label},A.createElement(O,{activePlugins:D,markup:m[n].author||"",onChange:e=>this.handleChange("author",e),nonEmpty:!1,error:P,mathMlOptions:o,languageCharactersProps:[{language:"spanish"},{language:"special"}],pluginProps:q(L([p,"optionalAccess",e=>e.inputConfiguration]))}),P&&A.createElement(W,null,P)),f&&A.createElement(H,{label:g.label},A.createElement(O,{activePlugins:Y,markup:m[n].text||"",onChange:e=>this.handleChange("text",e),imageSupport:a,uploadSoundSupport:i,nonEmpty:!1,error:y,maxImageWidth:s&&s.text||T,maxImageHeight:l&&l.text||R,mathMlOptions:o,languageCharactersProps:[{language:"spanish"},{language:"special"}],pluginProps:q(L([g,"optionalAccess",e=>e.inputConfiguration]))}),y&&A.createElement(W,null,y)))}}z.__initStatic(),z.__initStatic2();const B=a,$=e,{styled:F}=t,{Typography:U}=n,{settings:G}=l,{layout:N}=l,{Panel:J,toggle:K,dropdown:Q}=G,V=F(U)(({theme:e})=>({paddingTop:e.spacing(2),marginBottom:e.spacing(2)}));class X extends B.Component{static __initStatic(){this.propTypes={onModelChanged:$.func.isRequired,onConfigurationChanged:$.func,model:$.object.isRequired,configuration:$.object.isRequired,imageSupport:$.object.isRequired,uploadSoundSupport:$.object.isRequired,classes:$.object.isRequired}}constructor(e){super(e),X.prototype.__init.call(this),X.prototype.__init2.call(this),X.prototype.__init3.call(this),X.prototype.__init4.call(this),this.state={showConfirmationDialog:!1,indexToRemove:-1}}__init(){this.getInnerText=e=>(e||"").replaceAll(/<[^>]*>/g,"")}__init2(){this.onDelete=(e,t,a)=>{let n=e.passages;n.splice(t,1),a({...e,passages:n}),this.setState({showConfirmationDialog:!1,indexToRemove:-1})}}__init3(){this.removeAdditionalPassage=e=>{const{model:t={},onModelChanged:a}=this.props,{passages:n=[]}=t,{teacherInstructions:i="",title:s="",subtitle:l="",author:o="",text:r=""}=n[e];this.getInnerText(i).trim()||this.getInnerText(s).trim()||this.getInnerText(l).trim()||this.getInnerText(o).trim()||this.getInnerText(r).trim()?this.setState({showConfirmationDialog:!0,indexToRemove:e}):this.onDelete(t,e,a)}}__init4(){this.addAdditionalPassage=()=>{const{model:e,onModelChanged:t}=this.props,a=[...e.passages,{teacherInstructions:"",title:"",subtitle:"",author:"",text:""}];t({...e,passages:a})}}render(){const{model:e,configuration:t,imageSupport:a,onConfigurationChanged:n,onModelChanged:i,uploadSoundSupport:s}=this.props,{settingsPanelDisabled:l,language:o={},languageChoices:r={},teacherInstructions:d={},title:u={},subtitle:c={},text:g={},author:p={},additionalPassage:h={}}=t||{},{extraCSSRules:m,passages:b}=e||{},_={titleEnabled:u&&u.settings&&K(u.label),subtitleEnabled:c&&c.settings&&K(c.label),authorEnabled:p&&p.settings&&K(p.label),textEnabled:g&&g.settings&&K(g.label),"additionalPassage.enabled":h&&h.settings&&K(h.label,!0)},C={teacherInstructionsEnabled:d&&d.settings&&K(d.label),"language.enabled":o&&o.settings&&K(o.label,!0),language:o&&o.settings&&o.enabled&&Q(r.label,r.options)},E=`${h.label} will be deleted`,{indexToRemove:f,showConfirmationDialog:x}=this.state;return B.createElement(N.ConfigLayout,{extraCSSRules:m,hideSettings:l,settings:B.createElement(J,{model:e,configuration:t,onChangeModel:e=>i(e),onChangeConfiguration:e=>n(e),groups:{Settings:_,Properties:C}})},b.map((n,l)=>B.createElement(B.Fragment,{key:l},l>0&&B.createElement(V,{variant:"h5"},h.label),B.createElement(z,{imageSupport:a,uploadSoundSupport:s,model:e,configuration:t,passageIndex:l,onModelChanged:i}),l>0&&h.enabled&&B.createElement(D,{type:"remove",label:`Remove ${h.label}`,onClick:()=>this.removeAdditionalPassage(l)}),0===l&&h.enabled&&b.length<2&&B.createElement(D,{label:`Add ${h.label}`,onClick:this.addAdditionalPassage}))),B.createElement(k,{open:x,title:"Warning",content:E,cancel:"Cancel",ok:"Ok",onCancel:()=>this.setState({showConfirmationDialog:!1}),onOk:()=>this.onDelete(e,f,i)}))}}X.__initStatic();var Z={authorEnabled:!0,passages:[{teacherInstructions:"",title:"",subtitle:"",author:"",text:""}],subtitleEnabled:!0,teacherInstructionsEnabled:!0,textEnabled:!0,titleEnabled:!0},ee={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}},settingsPanelDisabled:!1,title:{settings:!0,label:"Title",inputConfiguration:{audio:{disabled:!0},video:{disabled:!0},image:{disabled:!0},textAlign:{disabled:!1}},required:!0},subtitle:{settings:!0,label:"Subtitle",inputConfiguration:{audio:{disabled:!0},video:{disabled:!0},image:{disabled:!0},textAlign:{disabled:!1}},required:!1},author:{settings:!0,label:"Author",inputConfiguration:{audio:{disabled:!0},video:{disabled:!0},image:{disabled:!0}},required:!1},text:{settings:!0,label:"Text",inputConfiguration:{audio:{disabled:!1},video:{disabled:!1},image:{disabled:!1},h3:{disabled:!1},blockquote:{disabled:!1},textAlign:{disabled:!1}},required:!0},teacherInstructions:{settings:!0,label:"Teacher Instructions",inputConfiguration:{audio:{disabled:!1},video:{disabled:!1},image:{disabled:!1}},required:!1},maxImageWidth:{teacherInstructions:300,text:300},maxImageHeight:{teacherInstructions:300,text:300},mathMlOptions:{mmlOutput:!1,mmlEditing:!1},language:{settings:!1,label:"Specify Language",enabled:!1},languageChoices:{label:"Language Choices",options:[]},additionalPassage:{settings:!0,label:"Additional Passage",enabled:!1}};const te=a,{createRoot:ae}=s;class ne extends HTMLElement{static __initStatic(){this.createDefaultModel=(e={})=>({...Z,...e})}constructor(){super(),this._root=null,this._model=ne.createDefaultModel(),this._configuration=ee}set model(e){this._model=ne.createDefaultModel(e),this.render()}set configuration(e){this._configuration=e,this.render()}connectedCallback(){this.render()}modelChanged(e){this._model=e,this.dispatchEvent(new u(this._model),!0),this.render()}onConfigurationChanged(e){this._configuration=e,this.render()}insertImage(e){this.dispatchEvent(new h(e))}onDeleteImage(e,t){this.dispatchEvent(new g(e,t))}insertSound(e){this.dispatchEvent(new C(e))}onDeleteSound(e,t){this.dispatchEvent(new b(e,t))}render(){if(this._model){const e=te.createElement(X,{model:this._model,configuration:this._configuration,onModelChanged:this.modelChanged.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)}});this._root||(this._root=ae(this)),this._root.render(e)}}disconnectedCallback(){this._root&&this._root.unmount()}}ne.__initStatic();export{ne as default};
|
|
1
|
+
import{_dll_prop_types as e,_dll_mui__material_styles as t,_dll_react as a,_dll_mui__material as n,_dll_mui__icons_material as i,_dll_react_dom_client as s}from"../../../@pie-lib/shared-module@^5.2.6/module/index.js";import{_dll_pie_lib__config_ui as l}from"../../../@pie-lib/config-module@^4.0.11/module/index.js";import{_dll_pie_lib__editable_html_tip_tap as o}from"../../../@pie-lib/editable-html-module@^7.1.8/module/index.js";var r={};Object.defineProperty(r,"__esModule",{value:!0});class d extends CustomEvent{constructor(e,t=!1){super(d.TYPE,{bubbles:!0,detail:{update:e,reset:t}}),this.update=e,this.reset=t}}d.TYPE="model.updated";var u=r.ModelUpdatedEvent=d;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 g=r.DeleteImageEvent=c;class p extends CustomEvent{constructor(e){super(p.TYPE,{bubbles:!0,detail:e}),this.handler=e}}p.TYPE="insert.image";var h=r.InsertImageEvent=p;class m extends CustomEvent{constructor(e,t){super(m.TYPE,{bubbles:!0,detail:{src:e,done:t}}),this.src=e,this.done=t}}m.TYPE="delete.sound";var b=r.DeleteSoundEvent=m;class _ extends CustomEvent{constructor(e){super(_.TYPE,{bubbles:!0,detail:e}),this.handler=e}}_.TYPE="insert.sound";var C=r.InsertSoundEvent=_;const E=a,f=e,{styled:x}=t,{Button:S}=n,{Dialog:I}=n,{DialogTitle:v}=n,{DialogContent:P}=n,{DialogContentText:y}=n,{DialogActions:T}=n,{RemoveCircle:R}=i,{AddCircle:q}=i,D=x(({label:e,type:t="add",onClick:a})=>{const n="add"===t?q:R;return E.createElement(S,{color:"primary",size:"small",onClick:a},E.createElement(n,{fontSize:"small",color:"primary",style:{marginRight:4}}),e)})({textDecoration:"underline","&:hover":{textDecoration:"underline",backgroundColor:"transparent"},display:"flex",alignItems:"center"}),k=({content:e,cancel:t,title:a,ok:n,open:i,onOk:s,onCancel:l})=>E.createElement(I,{open:i},E.createElement(v,null,a),E.createElement(P,null,E.createElement(y,null,e)),E.createElement(T,null,s&&E.createElement(S,{onClick:s,color:"primary"},n),l&&E.createElement(S,{onClick:l,color:"primary"},t)));k.propTypes={content:f.string.isRequired,title:f.string.isRequired,cancel:f.string.isRequired,ok:f.string.isRequired,open:f.bool.isRequired,onCancel:f.func.isRequired,onOk:f.func.isRequired};const A=a,M=e,{styled:w}=t,{InputContainer:j}=l,O=o,{ALL_PLUGINS:Y}=o;function L(e){let t,a=e[0],n=1;for(;n<e.length;){const i=e[n],s=e[n+1];if(n+=2,("optionalAccess"===i||"optionalCall"===i)&&null==a)return;"access"===i||"optionalAccess"===i?(t=a,a=s(a)):"call"!==i&&"optionalCall"!==i||(a=s((...e)=>a.call(t,...e)),t=void 0)}return a}const H=w(j)(({theme:e})=>({paddingTop:e.spacing(2),marginBottom:e.spacing(2),width:"100%"})),W=w("div")(({theme:e})=>({fontSize:e.typography.fontSize-2,color:e.palette.error.main,paddingTop:e.spacing(1)}));class z extends A.Component{static __initStatic(){this.propTypes={onModelChanged:M.func.isRequired,model:M.object.isRequired,configuration:M.object.isRequired,imageSupport:M.object.isRequired,passageIndex:M.number.isRequired,uploadSoundSupport:M.object.isRequired}}static __initStatic2(){this.defaultProps={passageIndex:0}}constructor(e){super(e),z.prototype.__init.call(this)}__init(){this.handleChange=(e,t)=>{const{model:a,onModelChanged:n,passageIndex:i}=this.props;if(!a.passages||i<0||i>=a.passages.length)return;const s=[...a.passages];s[i]={...s[i],[e]:t},n({...a,passages:s})}}render(){const{model:e,configuration:t,imageSupport:a,passageIndex:n,uploadSoundSupport:i}=this.props,{maxImageWidth:s={},maxImageHeight:l={},mathMlOptions:o={},baseInputConfiguration:r={},teacherInstructions:d={},title:u={},subtitle:c={},text:g={},author:p={}}=t||{},{errors:h={},passages:m=[],teacherInstructionsEnabled:b,titleEnabled:_,subtitleEnabled:C,authorEnabled:E,textEnabled:f}=e||{},{passages:x}=h||{},{teacherInstructions:S,title:I,subtitle:v,author:P,text:y}=x&&x[n]||{},T=s&&s.prompt,R=l&&l.prompt,q=e=>({...r,...e}),D=(Y||[]).filter(e=>!["math","table","bulleted-list","numbered-list"].includes(e));return A.createElement(A.Fragment,null,b&&A.createElement(H,{label:d.label},A.createElement(O,{activePlugins:Y,markup:m[n].teacherInstructions||"",onChange:e=>this.handleChange("teacherInstructions",e),nonEmpty:!1,error:S,maxImageWidth:s&&s.teacherInstructions||T,maxImageHeight:l&&l.teacherInstructions||R,mathMlOptions:o,languageCharactersProps:[{language:"spanish"},{language:"special"}],pluginProps:q(L([d,"optionalAccess",e=>e.inputConfiguration]))}),S&&A.createElement(W,null,S)),_&&A.createElement(H,{label:u.label},A.createElement(O,{activePlugins:D,markup:m[n].title||"",onChange:e=>this.handleChange("title",e),nonEmpty:!1,error:I,mathMlOptions:o,languageCharactersProps:[{language:"spanish"},{language:"special"}],pluginProps:q(L([u,"optionalAccess",e=>e.inputConfiguration]))}),I&&A.createElement(W,null,I)),C&&A.createElement(H,{label:c.label},A.createElement(O,{activePlugins:D,markup:m[n].subtitle||"",onChange:e=>this.handleChange("subtitle",e),nonEmpty:!1,error:v,mathMlOptions:o,languageCharactersProps:[{language:"spanish"},{language:"special"}],pluginProps:q(L([c,"optionalAccess",e=>e.inputConfiguration]))}),v&&A.createElement(W,null,v)),E&&A.createElement(H,{label:p.label},A.createElement(O,{activePlugins:D,markup:m[n].author||"",onChange:e=>this.handleChange("author",e),nonEmpty:!1,error:P,mathMlOptions:o,languageCharactersProps:[{language:"spanish"},{language:"special"}],pluginProps:q(L([p,"optionalAccess",e=>e.inputConfiguration]))}),P&&A.createElement(W,null,P)),f&&A.createElement(H,{label:g.label},A.createElement(O,{activePlugins:Y,markup:m[n].text||"",onChange:e=>this.handleChange("text",e),imageSupport:a,uploadSoundSupport:i,nonEmpty:!1,error:y,maxImageWidth:s&&s.text||T,maxImageHeight:l&&l.text||R,mathMlOptions:o,languageCharactersProps:[{language:"spanish"},{language:"special"}],pluginProps:q(L([g,"optionalAccess",e=>e.inputConfiguration]))}),y&&A.createElement(W,null,y)))}}z.__initStatic(),z.__initStatic2();const B=a,$=e,{styled:F}=t,{Typography:U}=n,{settings:G}=l,{layout:N}=l,{Panel:J,toggle:K,dropdown:Q}=G,V=F(U)(({theme:e})=>({paddingTop:e.spacing(2),marginBottom:e.spacing(2)}));class X extends B.Component{static __initStatic(){this.propTypes={onModelChanged:$.func.isRequired,onConfigurationChanged:$.func,model:$.object.isRequired,configuration:$.object.isRequired,imageSupport:$.object.isRequired,uploadSoundSupport:$.object.isRequired,classes:$.object.isRequired}}constructor(e){super(e),X.prototype.__init.call(this),X.prototype.__init2.call(this),X.prototype.__init3.call(this),X.prototype.__init4.call(this),this.state={showConfirmationDialog:!1,indexToRemove:-1}}__init(){this.getInnerText=e=>(e||"").replaceAll(/<[^>]*>/g,"")}__init2(){this.onDelete=(e,t,a)=>{let n=e.passages;n.splice(t,1),a({...e,passages:n}),this.setState({showConfirmationDialog:!1,indexToRemove:-1})}}__init3(){this.removeAdditionalPassage=e=>{const{model:t={},onModelChanged:a}=this.props,{passages:n=[]}=t,{teacherInstructions:i="",title:s="",subtitle:l="",author:o="",text:r=""}=n[e];this.getInnerText(i).trim()||this.getInnerText(s).trim()||this.getInnerText(l).trim()||this.getInnerText(o).trim()||this.getInnerText(r).trim()?this.setState({showConfirmationDialog:!0,indexToRemove:e}):this.onDelete(t,e,a)}}__init4(){this.addAdditionalPassage=()=>{const{model:e,onModelChanged:t}=this.props,a=[...e.passages,{teacherInstructions:"",title:"",subtitle:"",author:"",text:""}];t({...e,passages:a})}}render(){const{model:e,configuration:t,imageSupport:a,onConfigurationChanged:n,onModelChanged:i,uploadSoundSupport:s}=this.props,{settingsPanelDisabled:l,language:o={},languageChoices:r={},teacherInstructions:d={},title:u={},subtitle:c={},text:g={},author:p={},additionalPassage:h={}}=t||{},{extraCSSRules:m,passages:b}=e||{},_={titleEnabled:u&&u.settings&&K(u.label),subtitleEnabled:c&&c.settings&&K(c.label),authorEnabled:p&&p.settings&&K(p.label),textEnabled:g&&g.settings&&K(g.label),"additionalPassage.enabled":h&&h.settings&&K(h.label,!0)},C={teacherInstructionsEnabled:d&&d.settings&&K(d.label),"language.enabled":o&&o.settings&&K(o.label,!0),language:o&&o.settings&&o.enabled&&Q(r.label,r.options)},E=`${h.label} will be deleted`,{indexToRemove:f,showConfirmationDialog:x}=this.state;return B.createElement(N.ConfigLayout,{extraCSSRules:m,hideSettings:l,settings:B.createElement(J,{model:e,configuration:t,onChangeModel:e=>i(e),onChangeConfiguration:e=>n(e),groups:{Settings:_,Properties:C}})},b.map((n,l)=>B.createElement(B.Fragment,{key:l},l>0&&B.createElement(V,{variant:"h5"},h.label),B.createElement(z,{imageSupport:a,uploadSoundSupport:s,model:e,configuration:t,passageIndex:l,onModelChanged:i}),l>0&&h.enabled&&B.createElement(D,{type:"remove",label:`Remove ${h.label}`,onClick:()=>this.removeAdditionalPassage(l)}),0===l&&h.enabled&&b.length<2&&B.createElement(D,{label:`Add ${h.label}`,onClick:this.addAdditionalPassage}))),B.createElement(k,{open:x,title:"Warning",content:E,cancel:"Cancel",ok:"Ok",onCancel:()=>this.setState({showConfirmationDialog:!1}),onOk:()=>this.onDelete(e,f,i)}))}}X.__initStatic();var Z={authorEnabled:!0,passages:[{teacherInstructions:"",title:"",subtitle:"",author:"",text:""}],subtitleEnabled:!0,teacherInstructionsEnabled:!0,textEnabled:!0,titleEnabled:!0},ee={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}},settingsPanelDisabled:!1,title:{settings:!0,label:"Title",inputConfiguration:{audio:{disabled:!0},video:{disabled:!0},image:{disabled:!0},textAlign:{disabled:!1}},required:!0},subtitle:{settings:!0,label:"Subtitle",inputConfiguration:{audio:{disabled:!0},video:{disabled:!0},image:{disabled:!0},textAlign:{disabled:!1}},required:!1},author:{settings:!0,label:"Author",inputConfiguration:{audio:{disabled:!0},video:{disabled:!0},image:{disabled:!0}},required:!1},text:{settings:!0,label:"Text",inputConfiguration:{audio:{disabled:!1},video:{disabled:!1},image:{disabled:!1},h3:{disabled:!1},blockquote:{disabled:!1},textAlign:{disabled:!1}},required:!0},teacherInstructions:{settings:!0,label:"Teacher Instructions",inputConfiguration:{audio:{disabled:!1},video:{disabled:!1},image:{disabled:!1}},required:!1},maxImageWidth:{teacherInstructions:300,text:300},maxImageHeight:{teacherInstructions:300,text:300},mathMlOptions:{mmlOutput:!1,mmlEditing:!1},language:{settings:!1,label:"Specify Language",enabled:!1},languageChoices:{label:"Language Choices",options:[]},additionalPassage:{settings:!0,label:"Additional Passage",enabled:!1}};const te=a,{createRoot:ae}=s;class ne extends HTMLElement{static __initStatic(){this.createDefaultModel=(e={})=>({...Z,...e})}constructor(){super(),this._root=null,this._model=ne.createDefaultModel(),this._configuration=ee}set model(e){this._model=ne.createDefaultModel(e),this.render()}set configuration(e){this._configuration=e,this.render()}connectedCallback(){this.render()}modelChanged(e){this._model=e,this.dispatchEvent(new u(this._model),!0),this.render()}onConfigurationChanged(e){this._configuration=e,this.render()}insertImage(e){this.dispatchEvent(new h(e))}onDeleteImage(e,t){this.dispatchEvent(new g(e,t))}insertSound(e){this.dispatchEvent(new C(e))}onDeleteSound(e,t){this.dispatchEvent(new b(e,t))}render(){if(this._model){const e=te.createElement(X,{model:this._model,configuration:this._configuration,onModelChanged:this.modelChanged.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)}});this._root||(this._root=ae(this)),this._root.render(e)}}disconnectedCallback(){this._root&&this._root.unmount()}}ne.__initStatic();export{ne as default};
|
package/module/element.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{_dll_pie_lib__math_rendering as e}from"../../../@pie-lib/math-rendering-module@^5.0.
|
|
1
|
+
import{_dll_pie_lib__math_rendering as e}from"../../../@pie-lib/math-rendering-module@^5.0.11/module/index.js";import{_dll_react as t,_dll_prop_types as s,_dll_mui__material as i,_dll_mui__material_styles as a,_dll_pie_lib__render_ui as r,_dll_react_dom_client as n}from"../../../@pie-lib/shared-module@^5.2.6/module/index.js";var o={};Object.defineProperty(o,"__esModule",{value:!0});class l extends CustomEvent{constructor(e,t,s){super(l.TYPE,{bubbles:!0,composed:!0,detail:{complete:t,component:e,hasModel:s}}),this.component=e,this.complete=t}}l.TYPE="model-set";var d=o.ModelSetEvent=l;class c extends CustomEvent{constructor(e,t){super(c.TYPE,{bubbles:!0,composed:!0,detail:{complete:t,component:e}}),this.component=e,this.complete=t}}c.TYPE="session-changed",o.SessionChangedEvent=c;const h=t,p=s,{Tabs:m}=i,{Tab:b}=i,{styled:u}=a,{Collapsible:g}=r,{color:_}=r,{PreviewPrompt:v}=r,{Purpose:x}=r,{UiLayout:y}=r,{transformDataHeadings:f}=r;const E=u("div")({flexGrow:1,backgroundColor:_.background(),color:_.text(),"&:not(.MathJax) table":{borderCollapse:"collapse"},"&:not(.MathJax) table td, &:not(.MathJax) table th":{padding:".6em 1em",textAlign:"left"}}),T=u("div")(({theme:e})=>({backgroundColor:_.background(),color:_.text(),padding:e.spacing(2),"& blockquote":{background:"#f9f9f9",borderLeft:"5px solid #ccc",margin:"1.5em 10px",padding:".5em 10px"}})),M=u("div")({fontSize:"1.75rem"}),O=u("div")({fontSize:"1.5rem"}),k=u("div")({fontSize:"1.25rem"}),C=u(b)(({theme:e})=>({background:e.palette.common.white,fontSize:"inherit",fontFamily:"Roboto, sans-serif",color:e.palette.common.black,borderRadius:`${e.spacing(2)} ${e.spacing(2)} 0 0`,border:"1px solid #D9DADA",borderBottomWidth:0,minHeight:"56px",padding:"8px 10px",display:"flex",alignItems:"center",justifyContent:"center",margin:`0 ${e.spacing(1)}`,textTransform:"none",".passage-label":{display:"-webkit-box",WebkitLineClamp:2,WebkitBoxOrient:"vertical",overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"normal",margin:"auto 0",opacity:.7},"&.Mui-selected":{color:e.palette.common.black,".passage-label":{opacity:1},".passage-label-underline":{backgroundColor:_.tertiary()}},"&:hover":{".passage-label-underline":{backgroundColor:_.tertiaryLight()}},"& .MuiTouchRipple-root":{opacity:.7}})),w=u("div")(({theme:e})=>({height:"2px",width:"100%",marginTop:"6px",background:e.palette.common.white}));class A extends h.Component{constructor(...e){super(...e),A.prototype.__init.call(this),A.prototype.__init2.call(this),A.prototype.__init3.call(this),A.prototype.__init4.call(this)}__init(){this.state={activeTab:0}}__init2(){this.handleChange=(e,t)=>{this.setState(()=>({activeTab:t})),setTimeout(()=>{const e=new CustomEvent("pie-ui-passage-tabChanged",{detail:{tab:t}});window.dispatchEvent(e)})}}__init3(){this.handleKeyDown=(e,t)=>{const{key:s}=e,{tabs:i}=this.props;let a=-1;const r=i.findIndex(e=>e.id===t);switch(s){case"ArrowRight":a=(r+1)%i.length;break;case"ArrowLeft":a=(r-1+i.length)%i.length;break;case"Home":a=0;break;case"End":a=i.length-1;break;case"Enter":case" ":a=r}-1!==a&&(e.preventDefault(),e.stopPropagation(),this.handleChange(e,i[a].id),document.getElementById(`button-${i[a].id}`).focus())}}__init4(){this.parsedText=(e="")=>{const t=document.createElement("div");t.innerHTML=e.replace(/(<br\/>\n)/g,"<br/>");const s=t.querySelector("audio");if(s){const e=document.createElement("source");e.setAttribute("type","audio/mp3"),e.setAttribute("src",s.getAttribute("src")),s.removeAttribute("src"),s.appendChild(e)}return t.innerHTML}}renderInstructions(e,t=!1){if(!e)return;const s=h.createElement(v,{tagName:"div",className:"prompt",defaultClassName:"teacher-instructions",prompt:e});return t?s:h.createElement(g,{labels:{hidden:"Show Teacher Instructions",visible:"Hide Teacher Instructions"}},s)}renderTab(e,t){const{baseHeadingLevel:s}=this.props,i=s?Math.min(6,Math.max(1,s)):void 0,a=s?`h${i}`:"h2",r=s?Math.min(6,Math.max(1,i+1)):void 0;return h.createElement(T,{key:e.id,id:`tabpanel-${e.id}`,role:"tabpanel","aria-labelledby":`button-${e.id}`},this.renderInstructions(e.teacherInstructions,t),e.title&&h.createElement(x,{purpose:"passage-title"},h.createElement(a,null,h.createElement(M,{dangerouslySetInnerHTML:{__html:this.parsedText(e.title)}}))),e.subtitle&&h.createElement(x,{purpose:"passage-subtitle"},h.createElement(O,{dangerouslySetInnerHTML:{__html:this.parsedText(e.subtitle)}})),e.author&&h.createElement(x,{purpose:"passage-author"},h.createElement(k,{className:"author",dangerouslySetInnerHTML:{__html:this.parsedText(e.author)}})),e.text&&h.createElement(x,{purpose:"passage-text"},h.createElement("div",{key:e.id,className:"text",dangerouslySetInnerHTML:{__html:s?f(e.text,r):e.text}})))}render(){const{model:e,tabs:t,disabledTabs:s}=this.props,{activeTab:i}=this.state;if(!function(e){let t,s=e[0],i=1;for(;i<e.length;){const a=e[i],r=e[i+1];if(i+=2,("optionalAccess"===a||"optionalCall"===a)&&null==s)return;"access"===a||"optionalAccess"===a?(t=s,s=r(s)):"call"!==a&&"optionalCall"!==a||(s=r((...e)=>s.call(t,...e)),t=void 0)}return s}([t,"optionalAccess",e=>e.length]))return;const{extraCSSRules:a}=e||{},r=(t||[]).find(e=>e.id===i);return h.createElement(y,{extraCSSRules:a},h.createElement(E,{className:"passages"},s||1===t.length?t.map(e=>this.renderTab(e,s)):h.createElement(h.Fragment,null,h.createElement(m,{sx:{position:"static","@media (min-width: 841px)":{position:"sticky",top:0,zIndex:1},background:_.background(),color:_.text(),fontFamily:"Roboto, sans-serif","& .MuiTabs-list":{backgroundColor:_.white(),borderBottom:"1px solid #D9DADA"},"& .MuiTabs-indicator":{backgroundColor:_.white(),marginBottom:"-1px"}},value:i,onChange:this.handleChange},t.map(e=>h.createElement(C,{key:e.id,id:`button-${e.id}`,label:h.createElement(h.Fragment,null,h.createElement(x,{purpose:"passage-label"},h.createElement("span",{className:"passage-label",dangerouslySetInnerHTML:{__html:this.parsedText(e.label)}})),h.createElement(w,{className:"passage-label-underline"})),value:e.id,tabIndex:i===e.id?0:-1,"aria-controls":`tabpanel-${e.id}`,"aria-selected":i===e.id,onKeyDown:t=>this.handleKeyDown(t,e.id)}))),r?this.renderTab(r,s):null)))}}A.propTypes={tabs:p.arrayOf(p.shape({id:p.number.isRequired,label:p.string.isRequired,title:p.string.isRequired,subtitle:p.string,author:p.string,text:p.string.isRequired,teacherInstructions:p.string}).isRequired).isRequired,disabledTabs:p.bool,model:p.object,baseHeadingLevel:p.number};const{renderMath:L}=e,R=t,{createRoot:S}=n;function P(e){const t=e.closest("pie-player")||e.closest("pie-item-player");if(t){let e=t.baseHeadingLevel;null==e&&(s=t.getAttribute("base-heading-level"),i=()=>t.getAttribute("baseheadinglevel"),e=null!=s?s:i());const a=parseInt(e,10);if(Number.isFinite(a)&&a>=1&&a<=6)return a}var s,i}class I extends HTMLElement{constructor(){super(),I.prototype.__init.call(this),this._model={passages:[]},this._session=null,this._root=null,this._mathObserver=null,this._mathRenderPending=!1,this._playerObserver=null}setLangAttribute(){const e=this._model&&(this._model.language,1)?this._model.language:"",t=e?e.slice(0,2):"en";this.setAttribute("lang",t)}__init(){this._scheduleMathRender=()=>{this._mathRenderPending||(this._mathRenderPending=!0,requestAnimationFrame(()=>{this._mathObserver&&this._mathObserver.disconnect(),L(this),this._mathRenderPending=!1,setTimeout(()=>{this._mathObserver&&this._mathObserver.observe(this,{childList:!0,subtree:!0})},50)}))}}_initMathObserver(){this._mathObserver||(this._mathObserver=new MutationObserver(this._scheduleMathRender),this._mathObserver.observe(this,{childList:!0,subtree:!0}))}_disconnectMathObserver(){this._mathObserver&&(this._mathObserver.disconnect(),this._mathObserver=null)}set model(e){this._model=e,this.dispatchEvent(new d(this.tagName.toLowerCase(),this._session,!!this._model)),this.setLangAttribute(),this._render()}set session(e){this._session=e}connectedCallback(){this.setAttribute("aria-label","Passage"),this.setAttribute("role","region"),this._initMathObserver(),this._initPlayerObserver(),this._render()}_render(){const{passages:e=[]}=this._model;if(this._model.passages.length>0){const t=e.map((e,t)=>({id:t,...e})),s=R.createElement(A,{tabs:t,model:this._model,baseHeadingLevel:P(this)});this._root||(this._root=S(this)),this._root.render(s),this._initMathObserver()}}_initPlayerObserver(){const e=this.closest("pie-player")||this.closest("pie-item-player");e&&(this._playerObserver=new MutationObserver(()=>{this._render()}),this._playerObserver.observe(e,{attributes:!0,attributeFilter:["base-heading-level"]}))}_disconnectPlayerObserver(){this._playerObserver&&(this._playerObserver.disconnect(),this._playerObserver=null)}disconnectedCallback(){this._disconnectMathObserver(),this._disconnectPlayerObserver(),this._root&&this._root.unmount()}}export{I as default};
|
package/module/index.html
CHANGED
package/module/manifest.json
CHANGED
package/module/print.html
CHANGED
package/module/print.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{_dll_react as e,_dll_prop_types as t,_dll_mui__material as n,_dll_mui__material_styles as a,_dll_pie_lib__render_ui as i,_dll_debug as r,_dll_react_dom_client as o}from"../../../@pie-lib/shared-module@^5.2.
|
|
1
|
+
import{_dll_react as e,_dll_prop_types as t,_dll_mui__material as n,_dll_mui__material_styles as a,_dll_pie_lib__render_ui as i,_dll_debug as r,_dll_react_dom_client as o}from"../../../@pie-lib/shared-module@^5.2.6/module/index.js";var s="object"==typeof global&&global&&global.Object===Object&&global,l="object"==typeof self&&self&&self.Object===Object&&self,c=s||l||Function("return this")(),u=c.Symbol,d=Object.prototype,p=d.hasOwnProperty,b=d.toString,h=u?u.toStringTag:void 0;var m=Object.prototype.toString;var g=u?u.toStringTag:void 0;function f(e){return null==e?void 0===e?"[object Undefined]":"[object Null]":g&&g in Object(e)?function(e){var t=p.call(e,h),n=e[h];try{e[h]=void 0;var a=!0}catch(e){}var i=b.call(e);return a&&(t?e[h]=n:delete e[h]),i}(e):function(e){return m.call(e)}(e)}var v=/\s/;var x=/^\s+/;function y(e){return e?e.slice(0,function(e){for(var t=e.length;t--&&v.test(e.charAt(t)););return t}(e)+1).replace(x,""):e}function _(e){var t=typeof e;return null!=e&&("object"==t||"function"==t)}var E=/^[-+]0x[0-9a-f]+$/i,T=/^0b[01]+$/i,k=/^0o[0-7]+$/i,w=parseInt;function C(e){if("number"==typeof e)return e;if(function(e){return"symbol"==typeof e||function(e){return null!=e&&"object"==typeof e}(e)&&"[object Symbol]"==f(e)}(e))return NaN;if(_(e)){var t="function"==typeof e.valueOf?e.valueOf():e;e=_(t)?t+"":t}if("string"!=typeof e)return 0===e?e:+e;e=y(e);var n=T.test(e);return n||k.test(e)?w(e.slice(2),n?2:8):E.test(e)?NaN:+e}var S=function(){return c.Date.now()},I=Math.max,M=Math.min;function j(e,t,n){var a,i,r,o,s,l,c=0,u=!1,d=!1,p=!0;if("function"!=typeof e)throw new TypeError("Expected a function");function b(t){var n=a,r=i;return a=i=void 0,c=t,o=e.apply(r,n)}function h(e){var n=e-l;return void 0===l||n>=t||n<0||d&&e-c>=r}function m(){var e=S();if(h(e))return g(e);s=setTimeout(m,function(e){var n=t-(e-l);return d?M(n,r-(e-c)):n}(e))}function g(e){return s=void 0,p&&a?b(e):(a=i=void 0,o)}function f(){var e=S(),n=h(e);if(a=arguments,i=this,l=e,n){if(void 0===s)return function(e){return c=e,s=setTimeout(m,t),u?b(e):o}(l);if(d)return clearTimeout(s),s=setTimeout(m,t),b(l)}return void 0===s&&(s=setTimeout(m,t)),o}return t=C(t)||0,_(n)&&(u=!!n.leading,r=(d="maxWait"in n)?I(C(n.maxWait)||0,t):r,p="trailing"in n?!!n.trailing:p),f.cancel=function(){void 0!==s&&clearTimeout(s),c=0,a=l=i=s=void 0},f.flush=function(){return void 0===s?o:g(S())},f}const A=e,L=t,{Tabs:H}=n,{Tab:R}=n,{styled:N}=a,{Collapsible:O}=i,{color:$}=i,{PreviewPrompt:D}=i,{Purpose:q}=i,{UiLayout:P}=i,{transformDataHeadings:z}=i;const B=N("div")({flexGrow:1,backgroundColor:$.background(),color:$.text(),"&:not(.MathJax) table":{borderCollapse:"collapse"},"&:not(.MathJax) table td, &:not(.MathJax) table th":{padding:".6em 1em",textAlign:"left"}}),F=N("div")(({theme:e})=>({backgroundColor:$.background(),color:$.text(),padding:e.spacing(2),"& blockquote":{background:"#f9f9f9",borderLeft:"5px solid #ccc",margin:"1.5em 10px",padding:".5em 10px"}})),W=N("div")({fontSize:"1.75rem"}),J=N("div")({fontSize:"1.5rem"}),K=N("div")({fontSize:"1.25rem"}),U=N(R)(({theme:e})=>({background:e.palette.common.white,fontSize:"inherit",fontFamily:"Roboto, sans-serif",color:e.palette.common.black,borderRadius:`${e.spacing(2)} ${e.spacing(2)} 0 0`,border:"1px solid #D9DADA",borderBottomWidth:0,minHeight:"56px",padding:"8px 10px",display:"flex",alignItems:"center",justifyContent:"center",margin:`0 ${e.spacing(1)}`,textTransform:"none",".passage-label":{display:"-webkit-box",WebkitLineClamp:2,WebkitBoxOrient:"vertical",overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"normal",margin:"auto 0",opacity:.7},"&.Mui-selected":{color:e.palette.common.black,".passage-label":{opacity:1},".passage-label-underline":{backgroundColor:$.tertiary()}},"&:hover":{".passage-label-underline":{backgroundColor:$.tertiaryLight()}},"& .MuiTouchRipple-root":{opacity:.7}})),G=N("div")(({theme:e})=>({height:"2px",width:"100%",marginTop:"6px",background:e.palette.common.white}));class Q extends A.Component{constructor(...e){super(...e),Q.prototype.__init.call(this),Q.prototype.__init2.call(this),Q.prototype.__init3.call(this),Q.prototype.__init4.call(this)}__init(){this.state={activeTab:0}}__init2(){this.handleChange=(e,t)=>{this.setState(()=>({activeTab:t})),setTimeout(()=>{const e=new CustomEvent("pie-ui-passage-tabChanged",{detail:{tab:t}});window.dispatchEvent(e)})}}__init3(){this.handleKeyDown=(e,t)=>{const{key:n}=e,{tabs:a}=this.props;let i=-1;const r=a.findIndex(e=>e.id===t);switch(n){case"ArrowRight":i=(r+1)%a.length;break;case"ArrowLeft":i=(r-1+a.length)%a.length;break;case"Home":i=0;break;case"End":i=a.length-1;break;case"Enter":case" ":i=r}-1!==i&&(e.preventDefault(),e.stopPropagation(),this.handleChange(e,a[i].id),document.getElementById(`button-${a[i].id}`).focus())}}__init4(){this.parsedText=(e="")=>{const t=document.createElement("div");t.innerHTML=e.replace(/(<br\/>\n)/g,"<br/>");const n=t.querySelector("audio");if(n){const e=document.createElement("source");e.setAttribute("type","audio/mp3"),e.setAttribute("src",n.getAttribute("src")),n.removeAttribute("src"),n.appendChild(e)}return t.innerHTML}}renderInstructions(e,t=!1){if(!e)return;const n=A.createElement(D,{tagName:"div",className:"prompt",defaultClassName:"teacher-instructions",prompt:e});return t?n:A.createElement(O,{labels:{hidden:"Show Teacher Instructions",visible:"Hide Teacher Instructions"}},n)}renderTab(e,t){const{baseHeadingLevel:n}=this.props,a=n?Math.min(6,Math.max(1,n)):void 0,i=n?`h${a}`:"h2",r=n?Math.min(6,Math.max(1,a+1)):void 0;return A.createElement(F,{key:e.id,id:`tabpanel-${e.id}`,role:"tabpanel","aria-labelledby":`button-${e.id}`},this.renderInstructions(e.teacherInstructions,t),e.title&&A.createElement(q,{purpose:"passage-title"},A.createElement(i,null,A.createElement(W,{dangerouslySetInnerHTML:{__html:this.parsedText(e.title)}}))),e.subtitle&&A.createElement(q,{purpose:"passage-subtitle"},A.createElement(J,{dangerouslySetInnerHTML:{__html:this.parsedText(e.subtitle)}})),e.author&&A.createElement(q,{purpose:"passage-author"},A.createElement(K,{className:"author",dangerouslySetInnerHTML:{__html:this.parsedText(e.author)}})),e.text&&A.createElement(q,{purpose:"passage-text"},A.createElement("div",{key:e.id,className:"text",dangerouslySetInnerHTML:{__html:n?z(e.text,r):e.text}})))}render(){const{model:e,tabs:t,disabledTabs:n}=this.props,{activeTab:a}=this.state;if(!function(e){let t,n=e[0],a=1;for(;a<e.length;){const i=e[a],r=e[a+1];if(a+=2,("optionalAccess"===i||"optionalCall"===i)&&null==n)return;"access"===i||"optionalAccess"===i?(t=n,n=r(n)):"call"!==i&&"optionalCall"!==i||(n=r((...e)=>n.call(t,...e)),t=void 0)}return n}([t,"optionalAccess",e=>e.length]))return;const{extraCSSRules:i}=e||{},r=(t||[]).find(e=>e.id===a);return A.createElement(P,{extraCSSRules:i},A.createElement(B,{className:"passages"},n||1===t.length?t.map(e=>this.renderTab(e,n)):A.createElement(A.Fragment,null,A.createElement(H,{sx:{position:"static","@media (min-width: 841px)":{position:"sticky",top:0,zIndex:1},background:$.background(),color:$.text(),fontFamily:"Roboto, sans-serif","& .MuiTabs-list":{backgroundColor:$.white(),borderBottom:"1px solid #D9DADA"},"& .MuiTabs-indicator":{backgroundColor:$.white(),marginBottom:"-1px"}},value:a,onChange:this.handleChange},t.map(e=>A.createElement(U,{key:e.id,id:`button-${e.id}`,label:A.createElement(A.Fragment,null,A.createElement(q,{purpose:"passage-label"},A.createElement("span",{className:"passage-label",dangerouslySetInnerHTML:{__html:this.parsedText(e.label)}})),A.createElement(G,{className:"passage-label-underline"})),value:e.id,tabIndex:a===e.id?0:-1,"aria-controls":`tabpanel-${e.id}`,"aria-selected":a===e.id,onKeyDown:t=>this.handleKeyDown(t,e.id)}))),r?this.renderTab(r,n):null)))}}Q.propTypes={tabs:L.arrayOf(L.shape({id:L.number.isRequired,label:L.string.isRequired,title:L.string.isRequired,subtitle:L.string,author:L.string,text:L.string.isRequired,teacherInstructions:L.string}).isRequired).isRequired,disabledTabs:L.bool,model:L.object,baseHeadingLevel:L.number};const V=e,{createRoot:X}=o,Y=r("pie-element:passage:print"),Z=(e,t)=>(e=>null!=e)(e)?e:t;class ee extends HTMLElement{constructor(){super(),this._model=null,this._options=null,this._session=[],this._root=null,this._rerender=j(()=>{if(this._model&&this._session){if(this._model.passages&&this._model.passages.length>0){const e=((e,t)=>{const n="instructor"===t.role,a=Z(e.teacherInstructionsEnabled,!0),i=Z(e.titleEnabled,!0),r=Z(e.authorEnabled,!1),o=Z(e.subtitleEnabled,!0),s=Z(e.textEnabled,!0);return e.passages.map((e,t)=>({id:t,teacherInstructions:Z(e.teacherInstructionsEnabled,a)&&n&&e.teacherInstructions||"",label:e.title||`Passage ${t+1}`,title:Z(e.titleEnabled,i)&&e.title||"",author:Z(e.authorEnabled,r)&&e.author||"",subtitle:Z(e.subtitleEnabled,o)&&e.subtitle||"",text:Z(e.textEnabled,s)&&e.text||""}))})(this._model,this._options),t=V.createElement(Q,{disabledTabs:!0,tabs:e});this._root||(this._root=X(this)),this._root.render(t)}}else Y("skip")},50,{leading:!1,trailing:!0})}set model(e){this._model=e,this._rerender()}set options(e){this._options=e}connectedCallback(){}disconnectedCallback(){this._root&&this._root.unmount()}}export{ee as default};
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@pie-element/passage",
|
|
3
3
|
"repository": "pie-framework/pie-elements",
|
|
4
|
-
"version": "7.2.
|
|
4
|
+
"version": "7.2.1",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"access": "public"
|
|
7
7
|
},
|
|
@@ -20,7 +20,7 @@
|
|
|
20
20
|
"react": "18.3.1",
|
|
21
21
|
"react-dom": "18.3.1"
|
|
22
22
|
},
|
|
23
|
-
"gitHead": "
|
|
23
|
+
"gitHead": "395c1eeab967e1201bc5904cfe3cc63914ebbb4a",
|
|
24
24
|
"scripts": {
|
|
25
25
|
"postpublish": "../../scripts/postpublish"
|
|
26
26
|
},
|