Skip to content

Commit

Permalink
feat: add basic accessibility attributes to drop-down menu
Browse files Browse the repository at this point in the history
  • Loading branch information
@imzbf
imzbf committed Oct 17, 2024
1 parent 417c818 commit 8157549
Show file tree
Hide file tree
Showing 2 changed files with 46 additions and 1 deletion.
5 changes: 4 additions & 1 deletion packages/MdEditor/layouts/Modals/Clip.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -168,6 +168,9 @@ export default defineComponent({
onClick={() => {
(uploadRef.value as HTMLInputElement).click();
}}
role="button"
tabindex="0"
aria-label={ult.value.imgTitleItem?.upload}
>
<Icon name="upload" />
</div>
Expand Down Expand Up @@ -204,7 +207,7 @@ export default defineComponent({
type="file"
multiple={false}
style={{ display: 'none' }}
aria-label={ult.value.imgTitleItem?.upload}
aria-hidden="true"
/>
</Modal>
);
Expand Down
42 changes: 42 additions & 0 deletions packages/MdEditor/layouts/Toolbar/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -236,12 +236,15 @@ export default defineComponent({
onClick={() => {
visible.title = false;
}}
role="menu"
>
<li
class={`${prefix}-menu-item ${prefix}-menu-item-title`}
onClick={() => {
emitHandler('h1');
}}
role="menuitem"
tabindex="0"
>
{ult.value.titleItem?.h1}
</li>
Expand All @@ -250,6 +253,8 @@ export default defineComponent({
onClick={() => {
emitHandler('h2');
}}
role="menuitem"
tabindex="0"
>
{ult.value.titleItem?.h2}
</li>
Expand All @@ -258,6 +263,8 @@ export default defineComponent({
onClick={() => {
emitHandler('h3');
}}
role="menuitem"
tabindex="0"
>
{ult.value.titleItem?.h3}
</li>
Expand All @@ -266,6 +273,8 @@ export default defineComponent({
onClick={() => {
emitHandler('h4');
}}
role="menuitem"
tabindex="0"
>
{ult.value.titleItem?.h4}
</li>
Expand All @@ -274,6 +283,8 @@ export default defineComponent({
onClick={() => {
emitHandler('h5');
}}
role="menuitem"
tabindex="0"
>
{ult.value.titleItem?.h5}
</li>
Expand All @@ -282,6 +293,8 @@ export default defineComponent({
onClick={() => {
emitHandler('h6');
}}
role="menuitem"
tabindex="0"
>
{ult.value.titleItem?.h6}
</li>
Expand Down Expand Up @@ -509,13 +522,16 @@ export default defineComponent({
onClick={() => {
visible.title = false;
}}
role="menu"
>
<li
class={`${prefix}-menu-item ${prefix}-menu-item-image`}
onClick={() => {
modalData.type = 'image';
modalData.linkVisible = true;
}}
role="menuitem"
tabindex="0"
>
{ult.value.imgTitleItem?.link}
</li>
Expand All @@ -524,6 +540,8 @@ export default defineComponent({
onClick={() => {
(uploadRef.value as HTMLInputElement).click();
}}
role="menuitem"
tabindex="0"
>
{ult.value.imgTitleItem?.upload}
</li>
Expand All @@ -532,6 +550,8 @@ export default defineComponent({
onClick={() => {
modalData.clipVisible = true;
}}
role="menuitem"
tabindex="0"
>
{ult.value.imgTitleItem?.clip2upload}
</li>
Expand Down Expand Up @@ -834,12 +854,15 @@ export default defineComponent({
onClick={() => {
visible.mermaid = false;
}}
role="menu"
>
<li
class={`${prefix}-menu-item ${prefix}-menu-item-mermaid`}
onClick={() => {
emitHandler('flow');
}}
role="menuitem"
tabindex="0"
>
{ult.value.mermaid?.flow}
</li>
Expand All @@ -848,6 +871,8 @@ export default defineComponent({
onClick={() => {
emitHandler('sequence');
}}
role="menuitem"
tabindex="0"
>
{ult.value.mermaid?.sequence}
</li>
Expand All @@ -856,6 +881,8 @@ export default defineComponent({
onClick={() => {
emitHandler('gantt');
}}
role="menuitem"
tabindex="0"
>
{ult.value.mermaid?.gantt}
</li>
Expand All @@ -864,6 +891,8 @@ export default defineComponent({
onClick={() => {
emitHandler('class');
}}
role="menuitem"
tabindex="0"
>
{ult.value.mermaid?.class}
</li>
Expand All @@ -872,6 +901,8 @@ export default defineComponent({
onClick={() => {
emitHandler('state');
}}
role="menuitem"
tabindex="0"
>
{ult.value.mermaid?.state}
</li>
Expand All @@ -880,6 +911,8 @@ export default defineComponent({
onClick={() => {
emitHandler('pie');
}}
role="menuitem"
tabindex="0"
>
{ult.value.mermaid?.pie}
</li>
Expand All @@ -888,6 +921,8 @@ export default defineComponent({
onClick={() => {
emitHandler('relationship');
}}
role="menuitem"
tabindex="0"
>
{ult.value.mermaid?.relationship}
</li>
Expand All @@ -896,6 +931,8 @@ export default defineComponent({
onClick={() => {
emitHandler('journey');
}}
role="menuitem"
tabindex="0"
>
{ult.value.mermaid?.journey}
</li>
Expand Down Expand Up @@ -932,12 +969,15 @@ export default defineComponent({
onClick={() => {
visible.katex = false;
}}
role="menu"
>
<li
class={`${prefix}-menu-item ${prefix}-menu-item-katex`}
onClick={() => {
emitHandler('katexInline');
}}
role="menuitem"
tabindex="0"
>
{ult.value.katex?.inline}
</li>
Expand All @@ -946,6 +986,8 @@ export default defineComponent({
onClick={() => {
emitHandler('katexBlock');
}}
role="menuitem"
tabindex="0"
>
{ult.value.katex?.block}
</li>
Expand Down

0 comments on commit 8157549

Please sign in to comment.