diff --git a/editors/demo/src/Editoria/config/config.js b/editors/demo/src/Editoria/config/config.js index 6dca98b001f17c6497328a22e798c18bf05b6bf8..b2ae40a224965a69bb44f8ba462fcaa4c71a53ed 100644 --- a/editors/demo/src/Editoria/config/config.js +++ b/editors/demo/src/Editoria/config/config.js @@ -143,6 +143,7 @@ export default { }, }, PmPlugins: [columnResizing(), tableEditing(), invisibles([hardBreak()])], + ImageService: { showAlt: true }, CustomTagService: { tags: [ { label: 'custom-tag-label-1', tagType: 'inline' }, diff --git a/editors/demo/src/HHMI/config/config.js b/editors/demo/src/HHMI/config/config.js index 3fc07e3d9ecf36cccf0c44751e0984e5a4be541c..70ca2465e00b04e3ad4758887c2dfbe0bc3f99ac 100644 --- a/editors/demo/src/HHMI/config/config.js +++ b/editors/demo/src/HHMI/config/config.js @@ -65,7 +65,6 @@ export default { RulesService: [emDash, ellipsis], PmPlugins: [columnResizing(), tableEditing(), invisibles([hardBreak()])], - ImageService: { showAlt: false }, services: [ new MatchingService(), new FillTheGapQuestionService(), diff --git a/wax-prosemirror-services/src/ImageService/AltComponent.js b/wax-prosemirror-services/src/ImageService/AltComponent.js index 1c24aac4ff8f689d07a809cff619f2bb23893f54..9786988c1a4a4a9e1016da4e7f989299abe598a1 100644 --- a/wax-prosemirror-services/src/ImageService/AltComponent.js +++ b/wax-prosemirror-services/src/ImageService/AltComponent.js @@ -25,6 +25,7 @@ export default ({ setPosition, position }) => { const [altText, setAltText] = useState(''); const context = useContext(WaxContext); const { + app, activeView, pmViews: { main }, } = context; @@ -62,23 +63,24 @@ export default ({ setPosition, position }) => { ); }; - if (!readOnly) { - return ( - <StyledInputAlt - autoFocus="autoFocus" - key="alt" - onChange={altTextOnChange} - placeholder="Alt Text" - ref={altRef} - type="text" - value={ - activeView.state.selection && - activeView.state.selection.node && - activeView.state.selection.node.attrs.alt !== '' - ? activeView.state.selection.node.attrs.alt - : altText - } - /> - ); - } + const imageConfig = app.config.get('config.ImageService'); + const showAlt = imageConfig && imageConfig.showAlt; + + return !readOnly && showAlt ? ( + <StyledInputAlt + autoFocus="autoFocus" + key="alt" + onChange={altTextOnChange} + placeholder="Alt Text" + ref={altRef} + type="text" + value={ + activeView.state.selection && + activeView.state.selection.node && + activeView.state.selection.node.attrs.alt !== '' + ? activeView.state.selection.node.attrs.alt + : altText + } + /> + ) : null; };