Skip to content

Commit

Permalink
fix(GUI): radix a11y Dialog.Title visuallyHidden on publicationInfo D…
Browse files Browse the repository at this point in the history
…ialog

Dialog.content aria-describedby set to undefined on all Dialog.content components
  • Loading branch information
panaC committed Dec 3, 2024
1 parent d09641b commit 5f0243d
Show file tree
Hide file tree
Showing 8 changed files with 24 additions and 10 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -42,7 +42,7 @@ import { useTranslator } from "readium-desktop/renderer/common/hooks/useTranslat
import { useSelector } from "readium-desktop/renderer/common/hooks/useSelector";
import { ICommonRootState } from "readium-desktop/common/redux/states/commonRootState";


import * as VisuallyHidden from "@radix-ui/react-visually-hidden";


export interface IProps {
Expand Down Expand Up @@ -411,7 +411,10 @@ export const PublicationInfoContent: React.FC<React.PropsWithChildren<IProps>> =
</Dialog.Trigger>
<Dialog.Portal>
{/* <div className={stylesModals.modal_dialog_overlay}></div> */}
<Dialog.Content className={stylesModals.modal_dialog}>
<Dialog.Content className={stylesModals.modal_dialog} aria-describedby={undefined}>
<VisuallyHidden.Root>
<Dialog.Title>{__("catalog.bookInfo")}</Dialog.Title>
</VisuallyHidden.Root>
<div className={stylesModals.modal_dialog_body_cover}>
<Cover
publicationViewMaybeOpds={props.publicationViewMaybeOpds}
Expand Down
2 changes: 1 addition & 1 deletion src/renderer/library/components/Wizard.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -80,7 +80,7 @@ export const WizardModal = () => {
</Dialog.Trigger> */}
<Dialog.Portal>
<div className={stylesModals.modal_dialog_overlay}></div>
<Dialog.Content className={classNames(stylesModals.modal_dialog)}>
<Dialog.Content className={classNames(stylesModals.modal_dialog)} aria-describedby={undefined}>
<Tabs.Root defaultValue="tab1" data-orientation="vertical" orientation="vertical" className={stylesSettings.settings_container}>
<Tabs.List className={stylesSettings.settings_tabslist} data-orientation="vertical" aria-orientation="vertical">
<Tabs.Trigger value="tab1">
Expand Down
2 changes: 1 addition & 1 deletion src/renderer/library/components/dialog/ApiappAddForm.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -210,7 +210,7 @@ export const ApiappAddFormDialog = () => {
</Dialog.Trigger>
<Dialog.Portal>
<div className={stylesModals.modal_dialog_overlay}></div>
<Dialog.Content className={stylesModals.modal_dialog}>
<Dialog.Content className={stylesModals.modal_dialog} aria-describedby={undefined}>
<div className={stylesModals.modal_dialog_header}>
<Dialog.Title>
{__("opds.addFormApiapp.title")}
Expand Down
2 changes: 1 addition & 1 deletion src/renderer/library/components/dialog/OpdsFeedAddForm.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -82,7 +82,7 @@ export const OpdsFeedAddFormDialog = () => {
</Dialog.Trigger>
<Dialog.Portal>
<div className={stylesModals.modal_dialog_overlay}></div>
<Dialog.Content className={stylesModals.modal_dialog} >
<Dialog.Content className={stylesModals.modal_dialog} aria-describedby={undefined}>
<div className={stylesModals.modal_dialog_header}>
<Dialog.Title>
{__("opds.addMenu")}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -58,7 +58,7 @@ class OpdsFeedUpdateForm extends React.Component<IProps, IState> {
</Dialog.Trigger>
<Dialog.Portal>
<div className={stylesModals.modal_dialog_overlay}></div>
<Dialog.Content className={stylesModals.modal_dialog}>
<Dialog.Content className={stylesModals.modal_dialog} aria-describedby={undefined}>
<div className={stylesModals.modal_dialog_header}>
<Dialog.Title>
{__("opds.updateForm.title")}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,7 @@ import * as stylesModals from "readium-desktop/renderer/assets/styles/components
import * as stylesButtons from "readium-desktop/renderer/assets/styles/components/buttons.scss";

import * as Dialog from "@radix-ui/react-dialog";
import * as VisuallyHidden from "@radix-ui/react-visually-hidden";
import * as React from "react";
import { DialogType, DialogTypeName } from "readium-desktop/common/models/dialog";
import * as dialogActions from "readium-desktop/common/redux/actions/dialog";
Expand Down Expand Up @@ -89,7 +90,10 @@ export const PublicationInfoLibWithRadixContent = React.forwardRef<HTMLDivElemen
<Dialog.Portal>
{/* <Dialog.Overlay className="DialogOverlay" /> */}
<div className={stylesModals.modal_dialog_overlay}></div>
<Dialog.Content className={stylesModals.modal_dialog} {...props} ref={forwardRef}>
<Dialog.Content className={stylesModals.modal_dialog} {...props} ref={forwardRef} aria-describedby={undefined}>
<VisuallyHidden.Root>
<Dialog.Title>{__("catalog.bookInfo")}</Dialog.Title>
</VisuallyHidden.Root>
<div className={stylesModals.modal_dialog_header}>
{/* <Dialog.Title className="DialogTitle">{__("catalog.bookInfo")}</Dialog.Title> */}
<h1>{__("catalog.bookInfo")}</h1>
Expand Down Expand Up @@ -160,7 +164,10 @@ export const PublicationInfoOpdsWithRadixContent = React.forwardRef<HTMLDivEleme
<Dialog.Portal>
{/* <Dialog.Overlay className="DialogOverlay" /> */}
<div className={stylesModals.modal_dialog_overlay}></div>
<Dialog.Content className={stylesModals.modal_dialog} {...props} ref={forwardRef}>
<Dialog.Content className={stylesModals.modal_dialog} {...props} ref={forwardRef} aria-describedby={undefined}>
<VisuallyHidden.Root>
<Dialog.Title>{__("catalog.bookInfo")}</Dialog.Title>
</VisuallyHidden.Root>
<div className={stylesModals.modal_dialog_header}>
{/* <Dialog.Title className="DialogTitle">{__("catalog.bookInfo")}</Dialog.Title> */}
<h2>{__("catalog.bookInfo")}</h2>
Expand Down
2 changes: 1 addition & 1 deletion src/renderer/library/components/settings/Settings.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -327,7 +327,7 @@ export const Settings: React.FC<ISettingsProps> = () => {
</Dialog.Trigger>
<Dialog.Portal>
<div className={stylesModals.modal_dialog_overlay}></div>
<Dialog.Content className={classNames(stylesModals.modal_dialog)}>
<Dialog.Content className={classNames(stylesModals.modal_dialog)} aria-describedby={undefined}>
<Tabs.Root defaultValue="tab1" data-orientation="vertical" orientation="vertical" className={stylesSettings.settings_container}>
<Tabs.List className={stylesSettings.settings_tabslist} data-orientation="vertical" aria-orientation="vertical">
<Tabs.Trigger value="tab1">
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,7 @@ import * as stylesModals from "readium-desktop/renderer/assets/styles/components
import * as stylesButtons from "readium-desktop/renderer/assets/styles/components/buttons.scss";

import * as Dialog from "@radix-ui/react-dialog";
import * as VisuallyHidden from "@radix-ui/react-visually-hidden";
import * as debug_ from "debug";
import * as React from "react";
import { DialogType, DialogTypeName } from "readium-desktop/common/models/dialog";
Expand Down Expand Up @@ -68,7 +69,10 @@ export const PublicationInfoReaderWithRadixContent = React.forwardRef<HTMLDivEle
<Dialog.Portal container={appOverlayElement}>
{/* <Dialog.Overlay className="DialogOverlay" /> */}
<div className={stylesModals.modal_dialog_overlay}></div>
<Dialog.Content className={stylesModals.modal_dialog} {...props} ref={forwardRef}>
<Dialog.Content className={stylesModals.modal_dialog} {...props} ref={forwardRef} aria-describedby={undefined}>
<VisuallyHidden.Root>
<Dialog.Title>{__("catalog.bookInfo")}</Dialog.Title>
</VisuallyHidden.Root>
<div className={stylesModals.modal_dialog_header}>
{/* <Dialog.Title className="DialogTitle">{__("catalog.bookInfo")}</Dialog.Title> */}
<h1>{__("catalog.bookInfo")}</h1>
Expand Down

0 comments on commit 5f0243d

Please sign in to comment.