diff options
Diffstat (limited to 'src/components/Widgets/ToC/ToC.tsx')
| -rw-r--r-- | src/components/Widgets/ToC/ToC.tsx | 15 |
1 files changed, 13 insertions, 2 deletions
diff --git a/src/components/Widgets/ToC/ToC.tsx b/src/components/Widgets/ToC/ToC.tsx index 8a2d493..f3f783c 100644 --- a/src/components/Widgets/ToC/ToC.tsx +++ b/src/components/Widgets/ToC/ToC.tsx @@ -1,7 +1,7 @@ import { ExpandableWidget, OrderedList } from '@components/WidgetParts'; import { Heading } from '@ts/types/app'; import useHeadingsTree from '@utils/hooks/useHeadingsTree'; -import { useIntl } from 'react-intl'; +import { FormattedMessage, useIntl } from 'react-intl'; const ToC = () => { const intl = useIntl(); @@ -15,7 +15,18 @@ const ToC = () => { return headings.map((heading) => { return ( <li key={heading.id}> - <a href={`#${heading.id}`}>{heading.title}</a> + <a href={`#${heading.id}`}> + <FormattedMessage + defaultMessage="<a11y>Jump to </a11y>{title}" + description="ToC: link" + values={{ + title: heading.title, + a11y: (chunks: string) => ( + <span className="screen-reader-text">{chunks}</span> + ), + }} + /> + </a> {heading.children.length > 0 && ( <OrderedList items={getItems(heading.children)} /> )} |
