From de4ba08b355eeaac3548f8e8b9c89fe91011c3df Mon Sep 17 00:00:00 2001 From: Wagner Trezub Date: Tue, 4 Mar 2025 14:35:43 +0100 Subject: [PATCH 1/5] fix: added ariaLabel and set a defaultMessage to the component SingleDatePicker for react-dates --- packages/volto/locales/ca/LC_MESSAGES/volto.po | 5 +++++ packages/volto/locales/de/LC_MESSAGES/volto.po | 5 +++++ packages/volto/locales/en/LC_MESSAGES/volto.po | 5 +++++ packages/volto/locales/es/LC_MESSAGES/volto.po | 5 +++++ packages/volto/locales/eu/LC_MESSAGES/volto.po | 5 +++++ packages/volto/locales/fi/LC_MESSAGES/volto.po | 5 +++++ packages/volto/locales/fr/LC_MESSAGES/volto.po | 5 +++++ packages/volto/locales/hi/LC_MESSAGES/volto.po | 5 +++++ packages/volto/locales/it/LC_MESSAGES/volto.po | 5 +++++ packages/volto/locales/ja/LC_MESSAGES/volto.po | 5 +++++ packages/volto/locales/nl/LC_MESSAGES/volto.po | 5 +++++ packages/volto/locales/pt/LC_MESSAGES/volto.po | 5 +++++ packages/volto/locales/pt_BR/LC_MESSAGES/volto.po | 5 +++++ packages/volto/locales/ro/LC_MESSAGES/volto.po | 5 +++++ packages/volto/locales/volto.pot | 7 ++++++- packages/volto/locales/zh_CN/LC_MESSAGES/volto.po | 5 +++++ .../src/components/manage/Widgets/DatetimeWidget.jsx | 11 +++++++++++ 17 files changed, 92 insertions(+), 1 deletion(-) diff --git a/packages/volto/locales/ca/LC_MESSAGES/volto.po b/packages/volto/locales/ca/LC_MESSAGES/volto.po index 3e7b0dfe67b..121a0bf2a49 100644 --- a/packages/volto/locales/ca/LC_MESSAGES/volto.po +++ b/packages/volto/locales/ca/LC_MESSAGES/volto.po @@ -4839,6 +4839,11 @@ msgstr "" msgid "private" msgstr "privat" +#. Default: "Navigate forward to interact with the calendar and select a date. Press the question mark key to get the keyboard shortcuts for changing dates." +#: components/manage/Widgets/DatetimeWidget +msgid "publicationDateMessage" +msgstr "Navega cap endavant per interactuar amb el calendari i seleccionar una data. Prem la tecla de signe d’interrogació per obtenir les dreceres de teclat per canviar les dates." + #. Default: "Published" #: components/manage/Contents/ContentsItem msgid "published" diff --git a/packages/volto/locales/de/LC_MESSAGES/volto.po b/packages/volto/locales/de/LC_MESSAGES/volto.po index 043109a013a..779fe4c789c 100644 --- a/packages/volto/locales/de/LC_MESSAGES/volto.po +++ b/packages/volto/locales/de/LC_MESSAGES/volto.po @@ -4838,6 +4838,11 @@ msgstr "" msgid "private" msgstr "Privat" +#. Default: "Navigate forward to interact with the calendar and select a date. Press the question mark key to get the keyboard shortcuts for changing dates." +#: components/manage/Widgets/DatetimeWidget +msgid "publicationDateMessage" +msgstr "Navigieren Sie vorwärts, um mit dem Kalender zu interagieren und ein Datum auszuwählen. Drücken Sie die Fragezeichen-Taste, um die Tastaturkürzel zum Ändern von Daten zu erhalten" + #. Default: "Published" #: components/manage/Contents/ContentsItem msgid "published" diff --git a/packages/volto/locales/en/LC_MESSAGES/volto.po b/packages/volto/locales/en/LC_MESSAGES/volto.po index 9ad7a604aaa..6ffd210a847 100644 --- a/packages/volto/locales/en/LC_MESSAGES/volto.po +++ b/packages/volto/locales/en/LC_MESSAGES/volto.po @@ -4833,6 +4833,11 @@ msgstr "" msgid "private" msgstr "" +#. Default: "Navigate forward to interact with the calendar and select a date. Press the question mark key to get the keyboard shortcuts for changing dates." +#: components/manage/Widgets/DatetimeWidget +msgid "publicationDateMessage" +msgstr "" + #. Default: "Published" #: components/manage/Contents/ContentsItem msgid "published" diff --git a/packages/volto/locales/es/LC_MESSAGES/volto.po b/packages/volto/locales/es/LC_MESSAGES/volto.po index ff5b8c2299c..80a29e8da9b 100644 --- a/packages/volto/locales/es/LC_MESSAGES/volto.po +++ b/packages/volto/locales/es/LC_MESSAGES/volto.po @@ -4840,6 +4840,11 @@ msgstr "" msgid "private" msgstr "Privado" +#. Default: "Navigate forward to interact with the calendar and select a date. Press the question mark key to get the keyboard shortcuts for changing dates." +#: components/manage/Widgets/DatetimeWidget +msgid "publicationDateMessage" +msgstr "Navega hacia adelante para interactuar con el calendario y seleccionar una fecha. Presiona la tecla de interrogación para obtener los atajos de teclado para cambiar las fechas." + #. Default: "Published" #: components/manage/Contents/ContentsItem msgid "published" diff --git a/packages/volto/locales/eu/LC_MESSAGES/volto.po b/packages/volto/locales/eu/LC_MESSAGES/volto.po index aa260e34fa6..74385d49abb 100644 --- a/packages/volto/locales/eu/LC_MESSAGES/volto.po +++ b/packages/volto/locales/eu/LC_MESSAGES/volto.po @@ -4840,6 +4840,11 @@ msgstr "" msgid "private" msgstr "Pribatua" +#. Default: "Navigate forward to interact with the calendar and select a date. Press the question mark key to get the keyboard shortcuts for changing dates." +#: components/manage/Widgets/DatetimeWidget +msgid "publicationDateMessage" +msgstr "Aurrera nabigatu egutegiarekin elkarreragiteko eta data bat hautatzeko. Sakatu galdera ikurra data aldatzeko teklatuko lasterbideak lortzekos" + #. Default: "Published" #: components/manage/Contents/ContentsItem msgid "published" diff --git a/packages/volto/locales/fi/LC_MESSAGES/volto.po b/packages/volto/locales/fi/LC_MESSAGES/volto.po index 99c1f6ff046..7802b3e44be 100644 --- a/packages/volto/locales/fi/LC_MESSAGES/volto.po +++ b/packages/volto/locales/fi/LC_MESSAGES/volto.po @@ -4838,6 +4838,11 @@ msgstr "" msgid "private" msgstr "yksityinen" +#. Default: "Navigate forward to interact with the calendar and select a date. Press the question mark key to get the keyboard shortcuts for changing dates." +#: components/manage/Widgets/DatetimeWidget +msgid "publicationDateMessage" +msgstr "Siirry eteenpäin ollaksesi vuorovaikutuksessa kalenterin kanssa ja valitaksesi päivämäärän. Paina kysymysmerkkinäppäintä saadaksesi näppäinoikotiet päivämäärien muuttamiseen." + #. Default: "Published" #: components/manage/Contents/ContentsItem msgid "published" diff --git a/packages/volto/locales/fr/LC_MESSAGES/volto.po b/packages/volto/locales/fr/LC_MESSAGES/volto.po index 120eda4ebef..26b7bea798f 100644 --- a/packages/volto/locales/fr/LC_MESSAGES/volto.po +++ b/packages/volto/locales/fr/LC_MESSAGES/volto.po @@ -4840,6 +4840,11 @@ msgstr "" msgid "private" msgstr "Privé" +#. Default: "Navigate forward to interact with the calendar and select a date. Press the question mark key to get the keyboard shortcuts for changing dates." +#: components/manage/Widgets/DatetimeWidget +msgid "publicationDateMessage" +msgstr "Naviguez vers l’avant pour interagir avec le calendrier et sélectionner une date. Appuyez sur la touche point d’interrogation pour obtenir les raccourcis clavier permettant de changer les dates." + #. Default: "Published" #: components/manage/Contents/ContentsItem msgid "published" diff --git a/packages/volto/locales/hi/LC_MESSAGES/volto.po b/packages/volto/locales/hi/LC_MESSAGES/volto.po index 02196516423..87b4cd1af79 100644 --- a/packages/volto/locales/hi/LC_MESSAGES/volto.po +++ b/packages/volto/locales/hi/LC_MESSAGES/volto.po @@ -4833,6 +4833,11 @@ msgstr "" msgid "private" msgstr "निजी" +#. Default: "Navigate forward to interact with the calendar and select a date. Press the question mark key to get the keyboard shortcuts for changing dates." +#: components/manage/Widgets/DatetimeWidget +msgid "publicationDateMessage" +msgstr "कैलेंडर के साथ इंटरैक्ट करने और तारीख चुनने के लिए आगे बढ़ें। तारीख बदलने के लिए कीबोर्ड शॉर्टकट देखने के लिए प्रश्नवाचक चिह्न कुंजी दबाएं।" + #. Default: "Published" #: components/manage/Contents/ContentsItem msgid "published" diff --git a/packages/volto/locales/it/LC_MESSAGES/volto.po b/packages/volto/locales/it/LC_MESSAGES/volto.po index 6cccb3d46be..23981fcf93c 100644 --- a/packages/volto/locales/it/LC_MESSAGES/volto.po +++ b/packages/volto/locales/it/LC_MESSAGES/volto.po @@ -4833,6 +4833,11 @@ msgstr "Seleziona un'immagine esistente" msgid "private" msgstr "Privato" +#. Default: "Navigate forward to interact with the calendar and select a date. Press the question mark key to get the keyboard shortcuts for changing dates." +#: components/manage/Widgets/DatetimeWidget +msgid "publicationDateMessage" +msgstr "Naviga in avanti per interagire con il calendario e selezionare una data. Premi il tasto del punto interrogativo per ottenere le scorciatoie da tastiera per cambiare le date." + #. Default: "Published" #: components/manage/Contents/ContentsItem msgid "published" diff --git a/packages/volto/locales/ja/LC_MESSAGES/volto.po b/packages/volto/locales/ja/LC_MESSAGES/volto.po index e4c74c3188a..7a462bd9a68 100644 --- a/packages/volto/locales/ja/LC_MESSAGES/volto.po +++ b/packages/volto/locales/ja/LC_MESSAGES/volto.po @@ -4838,6 +4838,11 @@ msgstr "" msgid "private" msgstr "非表示" +#. Default: "Navigate forward to interact with the calendar and select a date. Press the question mark key to get the keyboard shortcuts for changing dates." +#: components/manage/Widgets/DatetimeWidget +msgid "publicationDateMessage" +msgstr "カレンダーを操作して日付を選択するには、前に進んでください。日付を変更するためのキーボードショートカットを表示するには、クエスチョンマークキーを押してください" + #. Default: "Published" #: components/manage/Contents/ContentsItem msgid "published" diff --git a/packages/volto/locales/nl/LC_MESSAGES/volto.po b/packages/volto/locales/nl/LC_MESSAGES/volto.po index 1b80a4e9833..5bac0f95cc9 100644 --- a/packages/volto/locales/nl/LC_MESSAGES/volto.po +++ b/packages/volto/locales/nl/LC_MESSAGES/volto.po @@ -4837,6 +4837,11 @@ msgstr "Kies een bestaande afbeelding" msgid "private" msgstr "Privé" +#. Default: "Navigate forward to interact with the calendar and select a date. Press the question mark key to get the keyboard shortcuts for changing dates." +#: components/manage/Widgets/DatetimeWidget +msgid "publicationDateMessage" +msgstr "Navigeer vooruit om met de kalender te interageren en een datum te selecteren. Druk op de vraagteken-toets om de sneltoetsen voor het wijzigen van datums te bekijken" + #. Default: "Published" #: components/manage/Contents/ContentsItem msgid "published" diff --git a/packages/volto/locales/pt/LC_MESSAGES/volto.po b/packages/volto/locales/pt/LC_MESSAGES/volto.po index 8f4040495a1..6f7c1f9f63f 100644 --- a/packages/volto/locales/pt/LC_MESSAGES/volto.po +++ b/packages/volto/locales/pt/LC_MESSAGES/volto.po @@ -4838,6 +4838,11 @@ msgstr "" msgid "private" msgstr "" +#. Default: "Navigate forward to interact with the calendar and select a date. Press the question mark key to get the keyboard shortcuts for changing dates." +#: components/manage/Widgets/DatetimeWidget +msgid "publicationDateMessage" +msgstr "Navegue para a frente para interagir com o calendário e selecionar uma data. Pressione a tecla de interrogação para ver os atalhos de teclado para alterar as datas." + #. Default: "Published" #: components/manage/Contents/ContentsItem msgid "published" diff --git a/packages/volto/locales/pt_BR/LC_MESSAGES/volto.po b/packages/volto/locales/pt_BR/LC_MESSAGES/volto.po index 76a25c310ca..f3fedd8bacd 100644 --- a/packages/volto/locales/pt_BR/LC_MESSAGES/volto.po +++ b/packages/volto/locales/pt_BR/LC_MESSAGES/volto.po @@ -4839,6 +4839,11 @@ msgstr "Selecione uma imagem existente" msgid "private" msgstr "Privado" +#. Default: "Navigate forward to interact with the calendar and select a date. Press the question mark key to get the keyboard shortcuts for changing dates." +#: components/manage/Widgets/DatetimeWidget +msgid "publicationDateMessage" +msgstr "Navegue para frente para interagir com o calendário e selecionar uma data. Pressione a tecla de interrogação para ver os atalhos de teclado para alterar as datas." + #. Default: "Published" #: components/manage/Contents/ContentsItem msgid "published" diff --git a/packages/volto/locales/ro/LC_MESSAGES/volto.po b/packages/volto/locales/ro/LC_MESSAGES/volto.po index 9199570724a..347619ce703 100644 --- a/packages/volto/locales/ro/LC_MESSAGES/volto.po +++ b/packages/volto/locales/ro/LC_MESSAGES/volto.po @@ -4839,6 +4839,11 @@ msgstr "Alegeți o imagine existentă" msgid "private" msgstr "privat" +#. Default: "Navigate forward to interact with the calendar and select a date. Press the question mark key to get the keyboard shortcuts for changing dates." +#: components/manage/Widgets/DatetimeWidget +msgid "publicationDateMessage" +msgstr "Navigați înainte pentru a interacționa cu calendarul și a selecta o dată. Apăsați tasta semn de întrebare pentru a obține comenzile rapide de la tastatură pentru schimbarea datelor." + #. Default: "Published" #: components/manage/Contents/ContentsItem msgid "published" diff --git a/packages/volto/locales/volto.pot b/packages/volto/locales/volto.pot index 18436bc9bf3..b9149649652 100644 --- a/packages/volto/locales/volto.pot +++ b/packages/volto/locales/volto.pot @@ -1,7 +1,7 @@ msgid "" msgstr "" "Project-Id-Version: Plone\n" -"POT-Creation-Date: 2024-12-06T13:45:21.266Z\n" +"POT-Creation-Date: 2025-03-04T11:40:01.749Z\n" "Last-Translator: Plone i18n \n" "Language-Team: Plone i18n \n" "Content-Type: text/plain; charset=utf-8\n" @@ -4835,6 +4835,11 @@ msgstr "" msgid "private" msgstr "" +#. Default: "Navigate forward to interact with the calendar and select a date. Press the question mark key to get the keyboard shortcuts for changing dates." +#: components/manage/Widgets/DatetimeWidget +msgid "publicationDateMessage" +msgstr "" + #. Default: "Published" #: components/manage/Contents/ContentsItem msgid "published" diff --git a/packages/volto/locales/zh_CN/LC_MESSAGES/volto.po b/packages/volto/locales/zh_CN/LC_MESSAGES/volto.po index 8b3aa943033..8a39873b39b 100644 --- a/packages/volto/locales/zh_CN/LC_MESSAGES/volto.po +++ b/packages/volto/locales/zh_CN/LC_MESSAGES/volto.po @@ -4839,6 +4839,11 @@ msgstr "" msgid "private" msgstr "保密" +#. Default: "Navigate forward to interact with the calendar and select a date. Press the question mark key to get the keyboard shortcuts for changing dates." +#: components/manage/Widgets/DatetimeWidget +msgid "publicationDateMessage" +msgstr "向前导航以与日历交互并选择日期。按问号键可获取更改日期的键盘快捷键。向前导航以与日历交互并选择日期。按问号键可获取更改日期的键盘快捷键。" + #. Default: "Published" #: components/manage/Contents/ContentsItem msgid "published" diff --git a/packages/volto/src/components/manage/Widgets/DatetimeWidget.jsx b/packages/volto/src/components/manage/Widgets/DatetimeWidget.jsx index c6a708d729f..8f20bbd9ebc 100644 --- a/packages/volto/src/components/manage/Widgets/DatetimeWidget.jsx +++ b/packages/volto/src/components/manage/Widgets/DatetimeWidget.jsx @@ -27,6 +27,11 @@ const messages = defineMessages({ id: 'Time', defaultMessage: 'Time', }, + publicationDateMessage: { + id: 'publicationDateMessage', + defaultMessage: + 'Navigate forward to interact with the calendar and select a date. Press the question mark key to get the keyboard shortcuts for changing dates.', + }, }); const PrevIcon = () => ( @@ -151,6 +156,10 @@ const DatetimeWidgetComponent = (props) => { const datetime = getInternalValue(); const isDateOnly = getDateOnly(); + const screenReaderInputMessage = intl.formatMessage( + messages.publicationDateMessage, + ); + return (
@@ -175,6 +184,8 @@ const DatetimeWidgetComponent = (props) => { navNext={} id={`${id}-date`} placeholder={intl.formatMessage(messages.date)} + ariaLabel={props.title} + screenReaderInputMessage={screenReaderInputMessage} />
{!isDateOnly && ( From 9776e879d4bbfdc66f2e0495f6552714b88458f8 Mon Sep 17 00:00:00 2001 From: Wagner Trezub Date: Tue, 4 Mar 2025 14:38:29 +0100 Subject: [PATCH 2/5] chore: 6808.bugfix --- packages/volto/news/6808.bugfix | 1 + 1 file changed, 1 insertion(+) create mode 100644 packages/volto/news/6808.bugfix diff --git a/packages/volto/news/6808.bugfix b/packages/volto/news/6808.bugfix new file mode 100644 index 00000000000..70d769c485f --- /dev/null +++ b/packages/volto/news/6808.bugfix @@ -0,0 +1 @@ +Improved accessibility for the ‘Datetime-Widget’ component by adding an ‘aria-label’ and a translation for the ‘screenReaderInputMessage’. @Wagner3UB \ No newline at end of file From 79ffd95f6b29b0b3d892e3b05995a08c47a0ef89 Mon Sep 17 00:00:00 2001 From: Wagner Trezub <60133113+Wagner3UB@users.noreply.github.com> Date: Tue, 4 Mar 2025 15:27:38 +0100 Subject: [PATCH 3/5] Update packages/volto/news/6808.bugfix Co-authored-by: Steve Piercy --- packages/volto/news/6808.bugfix | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/volto/news/6808.bugfix b/packages/volto/news/6808.bugfix index 70d769c485f..656403c043b 100644 --- a/packages/volto/news/6808.bugfix +++ b/packages/volto/news/6808.bugfix @@ -1 +1 @@ -Improved accessibility for the ‘Datetime-Widget’ component by adding an ‘aria-label’ and a translation for the ‘screenReaderInputMessage’. @Wagner3UB \ No newline at end of file +Improved accessibility for the `Datetime-Widget` component by adding an `aria-label` and a translation for the `screenReaderInputMessage`. @Wagner3UB \ No newline at end of file From b86b8d92e500552112c2136adba54e9a3bb03be3 Mon Sep 17 00:00:00 2001 From: Wagner Trezub Date: Tue, 8 Apr 2025 09:04:17 +0200 Subject: [PATCH 4/5] chore: snapshots --- .../manage/Widgets/__snapshots__/DatetimeWidget.test.jsx.snap | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/volto/src/components/manage/Widgets/__snapshots__/DatetimeWidget.test.jsx.snap b/packages/volto/src/components/manage/Widgets/__snapshots__/DatetimeWidget.test.jsx.snap index 3a22d5e73e9..1bf7fc063f1 100644 --- a/packages/volto/src/components/manage/Widgets/__snapshots__/DatetimeWidget.test.jsx.snap +++ b/packages/volto/src/components/manage/Widgets/__snapshots__/DatetimeWidget.test.jsx.snap @@ -46,7 +46,7 @@ exports[`datetime widget converts UTC date and adapt to local datetime 1`] = ` > Date: Tue, 8 Apr 2025 09:10:02 +0200 Subject: [PATCH 5/5] chore: translation --- packages/volto/locales/ru/LC_MESSAGES/volto.po | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/packages/volto/locales/ru/LC_MESSAGES/volto.po b/packages/volto/locales/ru/LC_MESSAGES/volto.po index 719d203ad7f..54c1dd91ee6 100644 --- a/packages/volto/locales/ru/LC_MESSAGES/volto.po +++ b/packages/volto/locales/ru/LC_MESSAGES/volto.po @@ -4890,6 +4890,11 @@ msgstr "Выберите существующее изображение" msgid "private" msgstr "Приватный" +#. Default: "Navigate forward to interact with the calendar and select a date. Press the question mark key to get the keyboard shortcuts for changing dates." +#: components/manage/Widgets/DatetimeWidget +msgid "publicationDateMessage" +msgstr "Перейдите вперёд, чтобы взаимодействовать с календарём и выбрать дату. Нажмите клавишу с вопросительным знаком, чтобы узнать сочетания клавиш для изменения даты." + #. Default: "Published" #: components/manage/Contents/ContentsItem msgid "published"