diff --git a/packages/react-codemirror-playground/src/App.tsx b/packages/react-codemirror-playground/src/App.tsx index a5caa45b..5de03f93 100644 --- a/packages/react-codemirror-playground/src/App.tsx +++ b/packages/react-codemirror-playground/src/App.tsx @@ -109,6 +109,7 @@ export function App() { theme={darkMode ? 'dark' : 'light'} history={Object.values(demos)} schema={schema} + ariaLabel="Cypher Editor" /> {commandRanCount > 0 && ( diff --git a/packages/react-codemirror/src/CypherEditor.tsx b/packages/react-codemirror/src/CypherEditor.tsx index 6724e9c3..4587da1e 100644 --- a/packages/react-codemirror/src/CypherEditor.tsx +++ b/packages/react-codemirror/src/CypherEditor.tsx @@ -135,6 +135,12 @@ export interface CypherEditorProps { * @default false */ readonly?: boolean; + + /** + * String value to assign to the aria-label attribute of the editor + * + */ + ariaLabel?: string; } const executeKeybinding = (onExecute?: (cmd: string) => void) => @@ -311,6 +317,11 @@ export class CypherEditor extends Component< ? EditorView.domEventHandlers(this.props.domEventHandlers) : [], ), + this.props.ariaLabel + ? EditorView.contentAttributes.of({ + 'aria-label': this.props.ariaLabel, + }) + : [], ], doc: this.props.value, });