From 64a08330cdc4088bde8b9f6e9a7049c7e6a51071 Mon Sep 17 00:00:00 2001
From: David Russell <david.russell@neo4j.com>
Date: Wed, 22 May 2024 11:29:00 +0100
Subject: [PATCH] add an aria label prop to the cypher editor

---
 packages/react-codemirror-playground/src/App.tsx |  1 +
 packages/react-codemirror/src/CypherEditor.tsx   | 11 +++++++++++
 2 files changed, 12 insertions(+)

diff --git a/packages/react-codemirror-playground/src/App.tsx b/packages/react-codemirror-playground/src/App.tsx
index a5caa45bc..5de03f931 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 6724e9c32..4587da1e6 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,
     });