diff --git a/RELEASE.md b/RELEASE.md index cf35f6503..002599dfc 100644 --- a/RELEASE.md +++ b/RELEASE.md @@ -30,12 +30,12 @@ - ... --> - ## Versione X.X.X (dd/mm/yyyy) ### Migliorie - Nel template Blocco link solo immagini con link esterni, icona accessibilità per link esterni ora è disattivabile attraverso opzione del template +- Migliorata l'accessibilità e il supporto Screen Reader per il menu a tendina "Ordina Per" nella pagina di ricerca ### Fix @@ -43,4 +43,3 @@ - Sistemato l'allineamento degli elementi nel blocco Contatti: se ci sono meno di tre elementi l'allineamento è centrato, se ce ne sono più di 3 l'allineamento è a sinistra. - Migliorata accessibilità del calendario nel blocco ricerca Eventi e ricerca Bandi - Fissato il layout del template Blocco link solo immagini con link esterni, posizionata l'icona di accessibilità per link esterni in overlay se presente - diff --git a/src/components/ItaliaTheme/Search/Search.jsx b/src/components/ItaliaTheme/Search/Search.jsx index 3f92bd168..97507cdb5 100644 --- a/src/components/ItaliaTheme/Search/Search.jsx +++ b/src/components/ItaliaTheme/Search/Search.jsx @@ -636,9 +636,14 @@ const Search = () => { sortOnOptions.filter((o) => o.value === sortOn)[0] } label={intl.formatMessage(messages.orderBy)} - placeholder={intl.formatMessage(messages.orderBy)} + placeholder={ + sortOnOptions.find((o) => o.value === sortOn).label + } onChange={(opt) => setSortOn(opt.value)} options={sortOnOptions} + defaultValue={sortOnOptions.find( + (o) => o.value === 'relevance', + )} /> diff --git a/src/components/SelectInput/SelectInput.jsx b/src/components/SelectInput/SelectInput.jsx index 0e6837e0d..83ac3ca8f 100644 --- a/src/components/SelectInput/SelectInput.jsx +++ b/src/components/SelectInput/SelectInput.jsx @@ -305,6 +305,7 @@ const SelectInput = ({ options, components = {}, reactSelect, + defaultValue, }) => { const intl = useIntl(); const Select = reactSelect.default; @@ -332,7 +333,9 @@ const SelectInput = ({ isSearchable={isSearchable} isMulti={isMulti} isClearable={isClearable} - aria-label={placeholder} + aria-label={label} + aria-live="polite" + aria-labelledby={id} ariaLiveMessages={getSelectAriaLiveMessages(intl)} noOptionsMessage={() => intl.formatMessage(messages.select_noOptionsMessage) @@ -346,6 +349,7 @@ const SelectInput = ({ }` } classNamePrefix={'react-select'} + defaultValue={defaultValue} /> );