fix(a11y): add sr-only DialogTitle/Description to record/export/timetravel modals

Radix Dialog warns when DialogContent отсутствует accessible name/description.
RecordDrawer (Sheet) уже имел Title, добавили sr-only Description.
ConflictDiffModal/ExportModal/TimeTravelModal — кастомные visible headers,
теперь имеют sr-only Title + Description для screen readers + чтобы
заглушить dev warnings.
This commit is contained in:
Zimin A.N.
2026-05-11 22:25:06 +03:00
parent 24f04ef3ef
commit 7429cff009
4 changed files with 40 additions and 3 deletions
@@ -1,6 +1,6 @@
import { useMemo, useState } from 'react'
import { useTranslation } from 'react-i18next'
import { Dialog, DialogContent } from '@/ui'
import { Dialog, DialogContent, DialogTitle, DialogDescription } from '@/ui'
import type { DictionaryDetail, FlattenedRecord } from '@/api/client'
import { cn } from '@/lib/utils'
@@ -175,6 +175,16 @@ export function ExportModal({
return (
<Dialog open={open} onOpenChange={(v) => !v && onClose()}>
<DialogContent size="xl" className="!p-0 gap-0">
{/* Radix a11y: visually-hidden Title + Description. Visible heading
* рендерится ниже как кастомный layout. */}
<DialogTitle className="sr-only">
{t('export.title', { defaultValue: 'Экспорт' })} {detail.name}
</DialogTitle>
<DialogDescription className="sr-only">
{t('export.description', {
defaultValue: 'Выбор формата, объёма и колонок для выгрузки.',
})}
</DialogDescription>
{/* Header */}
<div className="px-6 py-4 border-b border-line">
<div className="text-cap text-mute tracking-[0.18em] uppercase">