io-sanita-theme 2.3.1 → 2.3.2

package/CHANGELOG.md

@@ -1,5 +1,16 @@
 # Changelog
 
+## [2.3.2](https://github.com/RedTurtle/io-sanita-theme/compare/2.3.1...2.3.2) (2025-02-26)
+
+### Bug Fixes
+
+* a11y search blocks ([439519f](https://github.com/RedTurtle/io-sanita-theme/commit/439519f0763c79771bd0e6638147e24c32997a23))
+* mismatch ssr edit ([6a46afe](https://github.com/RedTurtle/io-sanita-theme/commit/6a46afee597cd372c28f6ec34edea544ce1a652c))
+
+### Maintenance
+
+* locales ([e44fb3d](https://github.com/RedTurtle/io-sanita-theme/commit/e44fb3d3b04ac2e12b4c31c47e3ed36c0ae33ac3))
+
 ## [2.3.1](https://github.com/RedTurtle/io-sanita-theme/compare/2.3.0...2.3.1) (2025-02-25)
 
 ### Bug Fixes

package/locales/de/LC_MESSAGES/volto.po

@@ -2736,7 +2736,7 @@ msgid "search_farmacia_results"
 msgstr ""
 
 #. Default: "Risultati della ricerca farmacie"
-#: components/Blocks/SearchFarmacia/Results
+#: components/Blocks/SearchFarmacia/Body
 msgid "search_farmacia_results_aria"
 msgstr ""
 
@@ -2755,6 +2755,11 @@ msgstr ""
 msgid "search_farmacia_searchable_text_description"
 msgstr ""
 
+#. Default: "Farmacia"
+#: components/Blocks/SearchFarmacia/SearchFilters
+msgid "search_farmacia_searchable_text_label"
+msgstr ""
+
 #. Default: "Comune"
 #: components/Blocks/SearchFarmacia/Body
 msgid "search_farmacia_sort_comune"

package/locales/en/LC_MESSAGES/volto.po

@@ -2731,7 +2731,7 @@ msgid "search_farmacia_results"
 msgstr "Results"
 
 #. Default: "Risultati della ricerca farmacie"
-#: components/Blocks/SearchFarmacia/Results
+#: components/Blocks/SearchFarmacia/Body
 msgid "search_farmacia_results_aria"
 msgstr "Search results"
 
@@ -2750,6 +2750,11 @@ msgstr "Search type"
 msgid "search_farmacia_searchable_text_description"
 msgstr "Enter the name of the pharmacy"
 
+#. Default: "Farmacia"
+#: components/Blocks/SearchFarmacia/SearchFilters
+msgid "search_farmacia_searchable_text_label"
+msgstr "Pharmacy"
+
 #. Default: "Comune"
 #: components/Blocks/SearchFarmacia/Body
 msgid "search_farmacia_sort_comune"

package/locales/es/LC_MESSAGES/volto.po

@@ -2738,7 +2738,7 @@ msgid "search_farmacia_results"
 msgstr ""
 
 #. Default: "Risultati della ricerca farmacie"
-#: components/Blocks/SearchFarmacia/Results
+#: components/Blocks/SearchFarmacia/Body
 msgid "search_farmacia_results_aria"
 msgstr ""
 
@@ -2757,6 +2757,11 @@ msgstr ""
 msgid "search_farmacia_searchable_text_description"
 msgstr ""
 
+#. Default: "Farmacia"
+#: components/Blocks/SearchFarmacia/SearchFilters
+msgid "search_farmacia_searchable_text_label"
+msgstr ""
+
 #. Default: "Comune"
 #: components/Blocks/SearchFarmacia/Body
 msgid "search_farmacia_sort_comune"

package/locales/fr/LC_MESSAGES/volto.po

@@ -2738,7 +2738,7 @@ msgid "search_farmacia_results"
 msgstr ""
 
 #. Default: "Risultati della ricerca farmacie"
-#: components/Blocks/SearchFarmacia/Results
+#: components/Blocks/SearchFarmacia/Body
 msgid "search_farmacia_results_aria"
 msgstr ""
 
@@ -2757,6 +2757,11 @@ msgstr ""
 msgid "search_farmacia_searchable_text_description"
 msgstr ""
 
+#. Default: "Farmacia"
+#: components/Blocks/SearchFarmacia/SearchFilters
+msgid "search_farmacia_searchable_text_label"
+msgstr ""
+
 #. Default: "Comune"
 #: components/Blocks/SearchFarmacia/Body
 msgid "search_farmacia_sort_comune"

package/locales/it/LC_MESSAGES/volto.po

@@ -2731,7 +2731,7 @@ msgid "search_farmacia_results"
 msgstr ""
 
 #. Default: "Risultati della ricerca farmacie"
-#: components/Blocks/SearchFarmacia/Results
+#: components/Blocks/SearchFarmacia/Body
 msgid "search_farmacia_results_aria"
 msgstr ""
 
@@ -2750,6 +2750,11 @@ msgstr ""
 msgid "search_farmacia_searchable_text_description"
 msgstr ""
 
+#. Default: "Farmacia"
+#: components/Blocks/SearchFarmacia/SearchFilters
+msgid "search_farmacia_searchable_text_label"
+msgstr ""
+
 #. Default: "Comune"
 #: components/Blocks/SearchFarmacia/Body
 msgid "search_farmacia_sort_comune"

package/locales/volto.pot

@@ -1,7 +1,7 @@
 msgid ""
 msgstr ""
 "Project-Id-Version: Plone\n"
-"POT-Creation-Date: 2025-02-25T11:31:39.047Z\n"
+"POT-Creation-Date: 2025-02-26T10:39:52.643Z\n"
 "Last-Translator: Plone i18n <plone-i18n@lists.sourceforge.net>\n"
 "Language-Team: Plone i18n <plone-i18n@lists.sourceforge.net>\n"
 "Content-Type: text/plain; charset=utf-8\n"
@@ -2733,7 +2733,7 @@ msgid "search_farmacia_results"
 msgstr ""
 
 #. Default: "Risultati della ricerca farmacie"
-#: components/Blocks/SearchFarmacia/Results
+#: components/Blocks/SearchFarmacia/Body
 msgid "search_farmacia_results_aria"
 msgstr ""
 
@@ -2752,6 +2752,11 @@ msgstr ""
 msgid "search_farmacia_searchable_text_description"
 msgstr ""
 
+#. Default: "Farmacia"
+#: components/Blocks/SearchFarmacia/SearchFilters
+msgid "search_farmacia_searchable_text_label"
+msgstr ""
+
 #. Default: "Comune"
 #: components/Blocks/SearchFarmacia/Body
 msgid "search_farmacia_sort_comune"

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "io-sanita-theme",
-  "version": "2.3.1",
+  "version": "2.3.2",
   "description": "io-sanita-theme: Volto add-on",
   "main": "src/index.js",
   "license": "MIT",

package/src/components/Blocks/SearchBandi/Body.jsx

@@ -153,6 +153,8 @@ const Body = ({ data, id, inEditMode, path, onChangeBlock, blocksConfig }) => {
   }
 
   const has_results = !loading && items?.length > 0;
+
+  const resultsWrapperId = `bandi-search-results-${id}`;
   return filterOne || filterTwo || filterThree ? (
     <div
       className={cx('full-width py-4', {
@@ -204,7 +206,12 @@ const Body = ({ data, id, inEditMode, path, onChangeBlock, blocksConfig }) => {
                       }),
                   })}
 
-                <Button color="accent" icon={false} className="my-0 my-lg-1">
+                <Button
+                  color="accent"
+                  icon={false}
+                  className="my-0 my-lg-1"
+                  aria-controls={resultsWrapperId}
+                >
                   {intl.formatMessage(messages.find)}
                 </Button>
               </div>
@@ -212,40 +219,42 @@ const Body = ({ data, id, inEditMode, path, onChangeBlock, blocksConfig }) => {
           </form>
         </div>
 
-        {!loading ? (
-          items?.length > 0 ? (
-            <div
-              className="mt-4"
-              ref={resultsRef}
-              aria-live="polite"
-              aria-label={intl.formatMessage(messages.search_bandi_results)}
-              role="region"
-            >
-              <div className="block listing">
-                <BandiTemplate items={items} full_width={false} />
-              </div>
-              {querystringResults.total > b_size && (
-                <Pagination
-                  activePage={currentPage}
-                  totalPages={Math.ceil(querystringResults.total / b_size)}
-                  onPageChange={handleQueryPaginationChange}
-                />
-              )}
+        <div
+          className="mt-4"
+          ref={resultsRef}
+          aria-live="polite"
+          aria-label={intl.formatMessage(messages.search_bandi_results)}
+          role="region"
+          id={resultsWrapperId}
+        >
+          {!loading ? (
+            items?.length > 0 ? (
+              <>
+                <div className="block listing">
+                  <BandiTemplate items={items} full_width={false} />
+                </div>
+                {querystringResults.total > b_size && (
+                  <Pagination
+                    activePage={currentPage}
+                    totalPages={Math.ceil(querystringResults.total / b_size)}
+                    onPageChange={handleQueryPaginationChange}
+                    ariaControls={resultsWrapperId}
+                  />
+                )}
+              </>
+            ) : querystringResults ? (
+              <p className="text-center">
+                {intl.formatMessage(messages.noResult)}
+              </p>
+            ) : (
+              <></>
+            )
+          ) : (
+            <div className="d-flex justify-content-center">
+              <Spinner active />
             </div>
-          ) : querystringResults ? (
-            <>
-              <div className="mt-4" aria-live="polite">
-                <p className="text-center">
-                  {intl.formatMessage(messages.noResult)}
-                </p>
-              </div>
-            </>
-          ) : null
-        ) : (
-          <div className="d-flex justify-content-center mt-3">
-            <Spinner active />
-          </div>
-        )}
+          )}
+        </div>
       </Container>
     </div>
   ) : null;

package/src/components/Blocks/SearchFarmacia/Body.jsx

@@ -36,6 +36,10 @@ const messages = defineMessages({
     id: 'search_farmacia_sort_localita',
     defaultMessage: 'Località',
   },
+  farmacie_results_aria: {
+    id: 'search_farmacia_results_aria',
+    defaultMessage: 'Risultati della ricerca farmacie',
+  },
 });
 
 const Body = ({ isEditMode, data, id }) => {
@@ -219,6 +223,7 @@ const Body = ({ isEditMode, data, id }) => {
     }
   }, [currentPage, results]);
 
+  const resultsWrapperId = 'search-farmacie-results_' + id;
   return (
     <div className="block iosanita-block-search farmacia">
       <div className="full-width bg-primary-lightest">
@@ -247,6 +252,7 @@ const Body = ({ isEditMode, data, id }) => {
                     searchType={searchType}
                     filters={filters}
                     options={filtersOptions}
+                    ariaControls={resultsWrapperId}
                     // isEditMode={isEditMode}
                     // doSearch={doSearch}
                     // checkClearComune={checkClearComune}
@@ -287,24 +293,34 @@ const Body = ({ isEditMode, data, id }) => {
                         title: intl.formatMessage(messages.localita),
                       },
                     ]}
+                    ariaControls={resultsWrapperId}
                   />
                 </Col>
               </Row>
             </form>
 
-            <Results
-              items={resultsPage}
-              isEditMode={isEditMode}
-              searchType={searchType}
-              resRef={resultsRef}
-            />
-            {results && results.length > b_size && (
-              <Pagination
-                activePage={currentPage}
-                totalPages={Math.ceil(results.length / b_size)}
-                onPageChange={handleQueryPaginationChange}
+            <div
+              className="farmacie-results shadow"
+              role="region"
+              aria-live="polite"
+              aria-label={intl.formatMessage(messages.farmacie_results_aria)}
+              ref={resultsRef}
+              id={resultsWrapperId}
+            >
+              <Results
+                items={resultsPage}
+                isEditMode={isEditMode}
+                searchType={searchType}
               />
-            )}
+              {results && results.length > b_size && (
+                <Pagination
+                  activePage={currentPage}
+                  totalPages={Math.ceil(results.length / b_size)}
+                  onPageChange={handleQueryPaginationChange}
+                  ariaControls={resultsWrapperId}
+                />
+              )}
+            </div>
           </Container>
         ) : (
           <Container className="d-flex justify-content-center mt-3">

package/src/components/Blocks/SearchFarmacia/Results.jsx

@@ -80,10 +80,6 @@ const messages = defineMessages({
     id: 'search_farmacia_no_results',
     defaultMessage: 'Nessun risultato trovato',
   },
-  farmacie_results_aria: {
-    id: 'search_farmacia_results_aria',
-    defaultMessage: 'Risultati della ricerca farmacie',
-  },
 });
 
 const ContactColumns = ({ isEditMode, item, searchType }) => {
@@ -183,112 +179,104 @@ const PeriodsStructure = ({ periods }) => {
   );
 };
 
-const Results = ({ items, isEditMode, resRef, searchType }) => {
+const Results = ({ items, isEditMode, searchType }) => {
   const intl = useIntl();
 
   return (
     <>
       {items?.length > 0 ? (
-        <div
-          className="farmacie-results shadow"
-          role="region"
-          aria-live="polite"
-          aria-label={intl.formatMessage(messages.farmacie_results_aria)}
-          ref={resRef}
-        >
-          <Table>
-            <Table.Header>
-              <Table.Row>
-                <Table.HeaderCell>
-                  {intl.formatMessage(messages.nome)} <br />
-                  {intl.formatMessage(messages.nome_en)}
-                </Table.HeaderCell>
-                <Table.HeaderCell>
-                  {intl.formatMessage(messages.comune)} <br />
-                  {intl.formatMessage(messages.comune_en)}
-                </Table.HeaderCell>
-                <Table.HeaderCell>
-                  {intl.formatMessage(messages.localita)}
-                  <br />
-                  {intl.formatMessage(messages.localita_en)}
-                </Table.HeaderCell>
-                <Table.HeaderCell>
-                  {intl.formatMessage(messages.indirizzo)}
-                  <br />
-                  {intl.formatMessage(messages.indirizzo_en)}
-                </Table.HeaderCell>
+        <Table>
+          <Table.Header>
+            <Table.Row>
+              <Table.HeaderCell>
+                {intl.formatMessage(messages.nome)} <br />
+                {intl.formatMessage(messages.nome_en)}
+              </Table.HeaderCell>
+              <Table.HeaderCell>
+                {intl.formatMessage(messages.comune)} <br />
+                {intl.formatMessage(messages.comune_en)}
+              </Table.HeaderCell>
+              <Table.HeaderCell>
+                {intl.formatMessage(messages.localita)}
+                <br />
+                {intl.formatMessage(messages.localita_en)}
+              </Table.HeaderCell>
+              <Table.HeaderCell>
+                {intl.formatMessage(messages.indirizzo)}
+                <br />
+                {intl.formatMessage(messages.indirizzo_en)}
+              </Table.HeaderCell>
+              <Table.HeaderCell>
+                {intl.formatMessage(messages.recapiti)}
+                <br />
+                {intl.formatMessage(messages.recapiti_en)}
+              </Table.HeaderCell>
+
+              {searchType === 'vacations' ? (
+                <>
+                  <Table.HeaderCell>
+                    {intl.formatMessage(messages.ferie)}
+                    <br />
+                    {intl.formatMessage(messages.ferie_en)}
+                  </Table.HeaderCell>
+                </>
+              ) : (
                 <Table.HeaderCell>
-                  {intl.formatMessage(messages.recapiti)}
+                  {intl.formatMessage(messages.turni)}
                   <br />
-                  {intl.formatMessage(messages.recapiti_en)}
+                  {intl.formatMessage(messages.turni_en)}
                 </Table.HeaderCell>
+              )}
+            </Table.Row>
+          </Table.Header>
+          <tbody>
+            {items.map((item, i) => (
+              <tr key={i}>
+                <td className="nome">
+                  {item['@id'] && (
+                    <p>
+                      <UniversalLink
+                        item={!isEditMode ? item : null}
+                        href={isEditMode ? '#' : null}
+                      >
+                        {item.title}
+                      </UniversalLink>
+                    </p>
+                  )}
+                </td>
+                <ContactColumns
+                  isEditMode={isEditMode}
+                  item={item}
+                  searchType={searchType}
+                />
+
+                {/* Periodi di turno */}
+                {searchType !== 'vacations' && (
+                  <td className="turni">
+                    <div className="th d-lg-none">
+                      {intl.formatMessage(messages.turni)}
+                      <br />
+                      {intl.formatMessage(messages.turni_en)}
+                    </div>
+                    <PeriodsStructure periods={item.turni} />
+                  </td>
+                )}
 
-                {searchType === 'vacations' ? (
-                  <>
-                    <Table.HeaderCell>
+                {/* Periodi di ferie */}
+                {searchType === 'vacations' && (
+                  <td className="ferie">
+                    <div className="th d-lg-none">
                       {intl.formatMessage(messages.ferie)}
                       <br />
                       {intl.formatMessage(messages.ferie_en)}
-                    </Table.HeaderCell>
-                  </>
-                ) : (
-                  <Table.HeaderCell>
-                    {intl.formatMessage(messages.turni)}
-                    <br />
-                    {intl.formatMessage(messages.turni_en)}
-                  </Table.HeaderCell>
-                )}
-              </Table.Row>
-            </Table.Header>
-            <tbody>
-              {items.map((item, i) => (
-                <tr key={i}>
-                  <td className="nome">
-                    {item['@id'] && (
-                      <p>
-                        <UniversalLink
-                          item={!isEditMode ? item : null}
-                          href={isEditMode ? '#' : null}
-                        >
-                          {item.title}
-                        </UniversalLink>
-                      </p>
-                    )}
+                    </div>
+                    <PeriodsStructure periods={item.ferie} />
                   </td>
-                  <ContactColumns
-                    isEditMode={isEditMode}
-                    item={item}
-                    searchType={searchType}
-                  />
-
-                  {/* Periodi di turno */}
-                  {searchType !== 'vacations' && (
-                    <td className="turni">
-                      <div className="th d-lg-none">
-                        {intl.formatMessage(messages.turni)}
-                        <br />
-                        {intl.formatMessage(messages.turni_en)}
-                      </div>
-                      <PeriodsStructure periods={item.turni} />
-                    </td>
-                  )}
-
-                  {/* Periodi di ferie */}
-                  {searchType === 'vacations' && (
-                    <td className="ferie">
-                      <div className="th d-lg-none">
-                        {intl.formatMessage(messages.ferie)}
-                        <br />
-                        {intl.formatMessage(messages.ferie_en)}
-                      </div>
-                      <PeriodsStructure periods={item.ferie} />
-                    </td>
-                  )}
-                </tr>
-              ))}
-            </tbody>
-          </Table>
-        </div>
+                )}
+              </tr>
+            ))}
+          </tbody>
+        </Table>
       ) : (
         <div className="message px-4">
           {intl.formatMessage(messages.no_results)}

package/src/components/Blocks/SearchFarmacia/SearchFilters.jsx

@@ -28,6 +28,10 @@ const messages = defineMessages({
     id: 'search_farmacia_searchable_text_description',
     defaultMessage: 'Inserisci il nome della farmacia',
   },
+  search_input_label: {
+    id: 'search_farmacia_searchable_text_label',
+    defaultMessage: 'Farmacia',
+  },
 });
 
 const SearchFilters = ({
@@ -54,6 +58,7 @@ const SearchFilters = ({
           onChange={(v) => {
             setFilters({ ...filters, searchableText: v });
           }}
+          ariaLabel={intl.formatMessage(messages.search_input_label)}
         />
       </Col>
 
@@ -71,6 +76,7 @@ const SearchFilters = ({
                   date: new Date(value).toISOString(),
                 });
               }}
+              title=""
             />
             <small className="ps-2">{intl.formatMessage(messages.date)}</small>{' '}
           </Col>
@@ -78,7 +84,7 @@ const SearchFilters = ({
           <Col lg="3">
             <SelectInput
               id="area_territoriale"
-              value={filters.area_territoriale}
+              value={filters.area_territoriale ?? ''}
               placeholder={intl.formatMessage(messages.area_territoriale)}
               onChange={(opt) => {
                 setFilters({ ...filters, area_territoriale: opt });

package/src/components/Blocks/SearchMap/Body.jsx

@@ -328,6 +328,11 @@ const SearchMapBody = ({ data, id, path, properties, block, inEditMode }) => {
   };
 
   const results_region_id = block_id + 'results-region';
+  const title =
+    data.title ??
+    (data.portal_type === 'Struttura'
+      ? intl.formatMessage(messages.searchable_text_default_label_strutture)
+      : intl.formatMessage(messages.searchable_text_default_label_medici));
   return (
     <div className="block iosanita-block-search map">
       <div className="strutture-search">
@@ -340,29 +345,21 @@ const SearchMapBody = ({ data, id, path, properties, block, inEditMode }) => {
               }}
             >
               <div className="search-top">
-                {data.title && !data.show_search_bar && (
-                  <LinkedHeadline
-                    isEditMode={inEditMode}
-                    title={data.title}
-                    id={id}
-                    className="h5"
-                  />
-                )}
+                <LinkedHeadline
+                  isEditMode={inEditMode}
+                  title={title}
+                  id={id}
+                  className={cx('h5', {
+                    'visually-hidden': data.show_search_bar, //to prevent a11y issue descendant headings
+                  })}
+                />
+
                 {data.show_search_bar && (
                   <Row>
                     <Col lg={8}>
                       <SearchBar
                         id={block_id}
-                        title={data.title}
-                        defaultTitle={
-                          data.portal_type === 'Struttura'
-                            ? intl.formatMessage(
-                                messages.searchable_text_default_label_strutture,
-                              )
-                            : intl.formatMessage(
-                                messages.searchable_text_default_label_medici,
-                              )
-                        }
+                        title={title}
                         textDescription={intl.formatMessage(
                           messages.searchable_text_decription,
                         )}

package/src/components/Blocks/SearchServiziProcedure/Body.jsx

@@ -211,6 +211,7 @@ const Body = ({ data, id, path, properties, inEditMode }) => {
               filterKey="users"
               sectionTitle={intl.formatMessage(messages.label_utenti)}
               collapsable={true}
+              ariaControls={results_region_id}
             />
           </div>
         )}
@@ -224,24 +225,29 @@ const Body = ({ data, id, path, properties, inEditMode }) => {
               filters={filters}
               filterKey="topics"
               collapsable={true}
+              ariaControls={results_region_id}
             />
           </div>
         )}
       </Col>
     );
   };
-
+  const title =
+    data.title ??
+    (data.portal_type === 'Servizio'
+      ? intl.formatMessage(messages.searchable_text_default_label_servizi)
+      : intl.formatMessage(messages.searchable_text_default_label_procedura));
   return (
     <div className="block iosanita-block-search servizi-procedure">
       <div className="full-width bg-primary-lightest py-4">
         <Container className="px-4">
           {/* TITOLO DEL BLOCCO */}
-          {data?.title && (
+          {title && (
             <LinkedHeadline
               isEditMode={inEditMode}
-              title={data.title}
+              title={title}
               id={id}
-              className="search-section-title mb-4"
+              className="h5 search-section-title visually-hidden" //visually-hidden for a11y descendant headings
             />
           )}
           <form
@@ -260,16 +266,7 @@ const Body = ({ data, id, path, properties, inEditMode }) => {
                 <SearchBar
                   id={block_id}
                   className="w-100"
-                  title={data.title}
-                  defaultTitle={
-                    data.portal_type === 'Servizio'
-                      ? intl.formatMessage(
-                          messages.searchable_text_default_label_servizi,
-                        )
-                      : intl.formatMessage(
-                          messages.searchable_text_default_label_procedura,
-                        )
-                  }
+                  title={title}
                   textDescription={
                     data.portal_type === 'Servizio'
                       ? intl.formatMessage(
@@ -361,6 +358,7 @@ const Body = ({ data, id, path, properties, inEditMode }) => {
                                     querystringResults.total / b_size,
                                   )}
                                   onPageChange={handleQueryPaginationChange}
+                                  ariaControls={results_region_id}
                                 />
                               )}
                             </div>

package/src/components/Pagination/Pagination.jsx

@@ -44,6 +44,7 @@ class Pagination extends Component {
     /** Total number of pages. */
     totalPages: PropTypes.oneOfType([PropTypes.number, PropTypes.string])
       .isRequired,
+    ariaControls: PropTypes.string,
   };
 
   static defaultProps = {
@@ -71,8 +72,13 @@ class Pagination extends Component {
   };
 
   render() {
-    const { boundaryRange, ellipsisItem, siblingRange, totalPages } =
-      this.props;
+    const {
+      boundaryRange,
+      ellipsisItem,
+      siblingRange,
+      totalPages,
+      ariaControls,
+    } = this.props;
     const { activePage } = this.state;
 
     const items = createPaginationItems({
@@ -102,6 +108,7 @@ class Pagination extends Component {
                 ellipsisItem={ellipsisItem}
                 isPrevButtonInactive={inactivePrevButton}
                 isForwButtonInactive={inactiveForwButton}
+                ariaControls={ariaControls}
               >
                 {value}
               </PaginationItem>

package/src/components/Pagination/PaginationItem.jsx

@@ -54,6 +54,7 @@ class PaginationItem extends Component {
 
     isPrevButtonInactive: PropTypes.bool,
     isForwButtonInactive: PropTypes.bool,
+    ariaControls: PropTypes.string,
   };
 
   handleClick = (e) => {
@@ -75,6 +76,7 @@ class PaginationItem extends Component {
       ellipsisItem,
       isPrevButtonInactive,
       isForwButtonInactive,
+      ariaControls,
     } = this.props;
     const disabled = this.props.disabled || type === 'ellipsisItem';
     return (
@@ -84,6 +86,7 @@ class PaginationItem extends Component {
           onClick={this.handleClick}
           onKeyDown={this.handleKeyDown}
           aria-current={active ? 'page' : null}
+          aria-controls={ariaControls}
         >
           {type === 'prevItem' && (
             <>

package/src/components/Widgets/SearchBar/SearchBar.jsx

@@ -31,6 +31,7 @@ const SearchBar = React.forwardRef(
       ariaControls,
       showSubmit = false,
       shadow = false,
+      ariaLabel,
     },
     ref,
   ) => {
@@ -71,9 +72,11 @@ const SearchBar = React.forwardRef(
         role="search"
         aria-label={title ?? defaultTitle}
       >
-        <label htmlFor={id + 'searchable-text'} className="active px-0 h5">
-          {title ?? defaultTitle}
-        </label>
+        {(title || defaultTitle) && (
+          <label htmlFor={id + 'searchable-text'} className="active px-0 h5">
+            {title ?? defaultTitle}
+          </label>
+        )}
 
         <div className={cx('input-group', { shadow: shadow })}>
           <span className="input-group-text">
@@ -84,11 +87,12 @@ const SearchBar = React.forwardRef(
             aria-describedby={id + 'searchable-text-description'}
             id={id + 'searchable-text'}
             className="form-control"
-            value={searchableText}
+            value={searchableText ?? ''}
             aria-controls={ariaControls}
             onChange={(e) => setSearchableText(e.currentTarget.value)}
             onKeyDown={onKeyDown}
             ref={ref}
+            aria-label={ariaLabel}
           />
           {showSubmit && (
             <div className="input-group-append">

package/src/components/Widgets/SearchCheckbox/SearchCheckbox.jsx

@@ -141,7 +141,7 @@ const SearchCheckbox = ({
 
   return (
     <div className="search-checkbox">
-      <h6 className="text-uppercase">
+      <div className="text-uppercase h6">
         {/* SECTION TITLE */}
         {title}
 
@@ -159,7 +159,7 @@ const SearchCheckbox = ({
             {activeOptions}
           </span>
         )}
-      </h6>
+      </div>
       <div className="mt-3">
         {/* TODO: se serve, attivare anche il 'seleziona tutto' */}
         {toggleAll && (

package/src/customizations/volto/components/theme/Header/Header.jsx

@@ -45,8 +45,8 @@ const Header = ({ pathname }) => {
       {/* <Headers sticky={true} className={mini ? 'is-sticky' : undefined}> */}
       <Headers
         className={cx({
-          'is-sticky': mini && !isEditMode,
-          'it-header-sticky': !isEditMode,
+          'is-sticky': mini, //&& !isEditMode, //rimossa condizione su isEditMode  perchè creava problemi di mismatch con il server
+          'it-header-sticky': true, //!isEditMode,
         })}
       >
         <HeaderSlim />

package/src/customizations/volto/components/theme/Navigation/Navigation.jsx

@@ -149,8 +149,9 @@ const Navigation = ({ pathname = '/', isEditMode }) => {
                 {/* Social Links */}
                 <HeaderSearch
                   className={cx({
-                    'd-none': isEditMode,
-                    'display-only-when-sticky': !isEditMode,
+                    //rimossa condizione su isEditMode  perchè creava problemi di mismatch con il server
+                    //'d-none': isEditMode,
+                    'display-only-when-sticky': true, //!isEditMode,
                   })}
                 />
                 <SocialHeader mobile={true} />