Us 46340 ordinamento risultati ricerca tastiera

RELEASE.md

@@ -35,3 +35,4 @@
 ### Fix
 
 - 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.
+- Sistemata accessibilità per il menu a tendina "Ordina Per" nella pagina di ricerca

src/components/ItaliaTheme/Blocks/ContactsBlock/Edit.jsx

@@ -106,15 +106,9 @@ class Edit extends SubblocksEdit {
             </div>
 
             <SubblocksWrapper node={this.node}>
-              <Row
-                className={
-                  this.state.subblocks.length > 3
-                    ? 'justify-content-start'
-                    : 'justify-content-center'
-                }
-              >
+              <Row className="justify-content-center">
                 {this.state.subblocks.map((subblock, subindex) => (
-                  <Col lg="4" key={subblock.id} className="pb-3">
+                  <Col lg="4" key={subblock.id}>
                     <EditBlock
                       data={subblock}
                       index={subindex}

src/components/ItaliaTheme/Blocks/ContactsBlock/View.jsx

@@ -42,13 +42,7 @@ const AccordionView = ({ data, block }) => {
                 )}
               </div>
             </div>
-            <Row
-              className={
-                data.subblocks.length > 3
-                  ? 'justify-content-start'
-                  : 'justify-content-center'
-              }
-            >
+            <Row className="justify-content-center">
               {data.subblocks.map((subblock, index) => (
                 <Col lg="4" key={subblock.id} className="pb-3">
                   <ViewBlock

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',
+                        )}
                       />
                     </Col>
                   </Row>

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}
       />
     </div>
   );