Merge pull request #460 from dharanish-v/main

feat: Add aria-label to MDXEditor and SingleChoiceToggleGroup
mdx-editor · May 19, 2024 · f4772e8 · f4772e8
2 parents 1e30685 + a66d09c
commit f4772e8
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 2 deletions.
diff --git a/src/MDXEditor.tsx b/src/MDXEditor.tsx
@@ -57,7 +57,9 @@ const RichTextEditor: React.FC = () => {
       <RenderRecursiveWrappers wrappers={editorWrappers}>
         <div className={classNames(styles.rootContentEditableWrapper, 'mdxeditor-root-contenteditable')}>
           <RichTextPlugin
-            contentEditable={<ContentEditable className={classNames(styles.contentEditable, contentEditableClassName)} />}
+            contentEditable={
+              <ContentEditable className={classNames(styles.contentEditable, contentEditableClassName)} ariaLabel="editable markdown" />
+            }
             placeholder={
               <div className={classNames(styles.contentEditable, styles.placeholder, contentEditableClassName)}>
                 <p>{placeholder}</p>

diff --git a/src/plugins/toolbar/primitives/toolbar.tsx b/src/plugins/toolbar/primitives/toolbar.tsx
@@ -155,6 +155,7 @@ export const SingleChoiceToggleGroup = <T extends string>({
   return (
     <div className={styles.toolbarGroupOfGroups}>
       <RadixToolbar.ToggleGroup
+        aria-label="toggle group"
         type="single"
         className={classNames(styles.toolbarToggleSingleGroup, className)}
         onValueChange={onChange}
@@ -164,7 +165,7 @@ export const SingleChoiceToggleGroup = <T extends string>({
         }}
       >
         {items.map((item, index) => (
-          <ToolbarToggleItem key={index} value={item.value}>
+          <ToolbarToggleItem key={index} aria-label={item.title} value={item.value}>
             <TooltipWrap title={item.title}>{item.contents}</TooltipWrap>
           </ToolbarToggleItem>
         ))}