design-comuni-plone-theme 11.11.2 → 11.12.1

package/.github/workflows/npm.yml

@@ -6,6 +6,9 @@ on:
 jobs:
   release_to_npm:
     runs-on: ubuntu-latest
+    permissions:
+      contents: read
+      id-token: write
     steps:
       - uses: actions/checkout@v4
 
@@ -14,6 +17,8 @@ jobs:
           node-version: '18.x'
           registry-url: 'https://registry.npmjs.org'
 
+      - run: npm install -g npm
+
       - run: yarn
 
       - name: Release to npm

package/CHANGELOG.md

@@ -1,5 +1,56 @@
 
 
+## [11.12.1](https://github.com/redturtle/design-comuni-plone-theme/compare/v11.12.0...v11.12.1) (2024-05-21)
+
+
+### Bug Fixes
+
+* use UniversalLink in PageHeaderTassonomiaArgomenti ([690da33](https://github.com/redturtle/design-comuni-plone-theme/commit/690da33a5f568b177a9ac748af5a85da7520e314))
+
+
+### Maintenance
+
+* fix npm release script ([bb652d7](https://github.com/redturtle/design-comuni-plone-theme/commit/bb652d717558f1541ad9c4d5250effe3adcd7f0a))
+
+
+### Documentation
+
+* updated publiccode and release log ([1b3b3a9](https://github.com/redturtle/design-comuni-plone-theme/commit/1b3b3a9a28fb7ec31124fab06fec984000ad67ce))
+
+## [11.12.0](https://github.com/redturtle/design-comuni-plone-theme/compare/v11.11.2...v11.12.0) (2024-05-21)
+
+
+### Features
+
+* added link to cardWithImage image ([#682](https://github.com/redturtle/design-comuni-plone-theme/issues/682)) ([a223f33](https://github.com/redturtle/design-comuni-plone-theme/commit/a223f334dd4e1d19fb7e84958631778fc4d4bcff))
+* added pagination to servizio cards in UO ([#678](https://github.com/redturtle/design-comuni-plone-theme/issues/678)) ([4abefd5](https://github.com/redturtle/design-comuni-plone-theme/commit/4abefd5859b66cb923c01951dcdfc63778875e8e))
+* otp code in volto-form-block for bcc email fields ([#652](https://github.com/redturtle/design-comuni-plone-theme/issues/652)) ([c2a9a8c](https://github.com/redturtle/design-comuni-plone-theme/commit/c2a9a8cb50ca00b63c81040baab4426fd9b7f1f8))
+
+
+### Bug Fixes
+
+* accessibility fixes after bootstrap-italia upgrade ([#679](https://github.com/redturtle/design-comuni-plone-theme/issues/679)) ([449875d](https://github.com/redturtle/design-comuni-plone-theme/commit/449875d85dd15c5b7af366309fd3982db3b33926))
+* added a11y params for lisingImage ([#684](https://github.com/redturtle/design-comuni-plone-theme/issues/684)) ([da1110b](https://github.com/redturtle/design-comuni-plone-theme/commit/da1110bd58db54f4274558446bb5d452ba40383c))
+* alignment of imgs in grid block ([#681](https://github.com/redturtle/design-comuni-plone-theme/issues/681)) ([aa3a243](https://github.com/redturtle/design-comuni-plone-theme/commit/aa3a243741d7407f8d7226b01a904545f90f5100))
+* avoid unnecessary [@breadcrumbs](https://github.com/breadcrumbs) call ([#677](https://github.com/redturtle/design-comuni-plone-theme/issues/677)) ([25938aa](https://github.com/redturtle/design-comuni-plone-theme/commit/25938aa789a53b3eb87c47a18c935a9add2e1c3f))
+* changed img layout in grid block ([#675](https://github.com/redturtle/design-comuni-plone-theme/issues/675)) ([1fa5557](https://github.com/redturtle/design-comuni-plone-theme/commit/1fa55574551f6cb0f34b88d3e7f1bc8b5e69db34))
+* changed layout and styles of highlighted words in search page ([#683](https://github.com/redturtle/design-comuni-plone-theme/issues/683)) ([d8f4d09](https://github.com/redturtle/design-comuni-plone-theme/commit/d8f4d090286469d4efdbb42bf30505abaa48cab8))
+* it translation for rrule ([#676](https://github.com/redturtle/design-comuni-plone-theme/issues/676)) ([d9a74eb](https://github.com/redturtle/design-comuni-plone-theme/commit/d9a74ebd58a17c10bceef9fbf558d7e74ec16c99))
+* prevent xss in form block reading sent data from BE response ([#651](https://github.com/redturtle/design-comuni-plone-theme/issues/651)) ([81a5a9e](https://github.com/redturtle/design-comuni-plone-theme/commit/81a5a9edd9cfa9072d2f746b607b04d30fc1845b))
+* removed unnecessary text - documento accedi al servizio ([#663](https://github.com/redturtle/design-comuni-plone-theme/issues/663)) ([fad9abb](https://github.com/redturtle/design-comuni-plone-theme/commit/fad9abb65989b18de1d7fc75ae61c208f1e62da9))
+* translation for rrule_on ([#680](https://github.com/redturtle/design-comuni-plone-theme/issues/680)) ([009c72a](https://github.com/redturtle/design-comuni-plone-theme/commit/009c72af463f5748a64f2c9c0afe0567ca192c26))
+* update volto-form-block to 3.8.3 ([46c55fe](https://github.com/redturtle/design-comuni-plone-theme/commit/46c55fe71ab533d66b4ec75374d7332a2539699d))
+
+
+### Maintenance
+
+* fix npm release script ([fcdce81](https://github.com/redturtle/design-comuni-plone-theme/commit/fcdce81c3fcfd5f46dd495dace84d662ffa7d307))
+
+
+### Documentation
+
+* updated publiccode and release log ([61e1da3](https://github.com/redturtle/design-comuni-plone-theme/commit/61e1da376c3f64569d36144be21da1fcf00dff90))
+
 ## [11.11.2](https://github.com/redturtle/design-comuni-plone-theme/compare/v11.11.1...v11.11.2) (2024-05-02)
 
 

package/RELEASE.md

@@ -41,6 +41,29 @@
 - ...
 -->
 
+## Versione 11.12.1 (21/05/2024)
+
+### Migliorie
+
+- Migliorate le performance di navigazione per alcuni link agli argomenti nella testata delle pagine.
+
+## Versione 11.12.0 (21/05/2024)
+
+### Migliorie
+
+- Se una Unità Organizzativa è collegata a più di 4 servizi, le card dei servizi collegati verranno divise in diverse pagine navigabili da uno strumento di paginazione per rendere lo scorrimento della pagina più semplice.
+- Cambiato il layout delle immagini all'interno del blocco Griglia.
+- Migliorata la visualizzazione delle parole evidenziate nella pagina di Ricerca.
+- Rinominato il contenitore "Altri allegati" dentro i contenuti di tipo Persona in "Altri documenti".
+
+### Novità
+
+- Le immagini delle Card con Immagine del blocco Elenco sono ora cliccabili. Cliccandole si apre il contenuto della Card.
+
+### Fix
+
+- Corretto il testo per la ricorrenza eventi nel CT Eventi.
+
 ## Versione 11.11.1 (02/05/2024)
 
 ### Migliorie

package/locales/de/LC_MESSAGES/volto.po

@@ -119,6 +119,11 @@ msgstr ""
 msgid "Cerca per parola chiave"
 msgstr ""
 
+#: overrideTranslations
+# defaultMessage: Pulisci i campi
+msgid "Clear dates"
+msgstr ""
+
 #: helpers/Translations/searchBlockExtendedTranslations
 # defaultMessage: Clear filters
 msgid "Clear filters"
@@ -3007,6 +3012,11 @@ msgstr ""
 msgid "rrule_nd"
 msgstr ""
 
+#: overrideTranslations
+# defaultMessage: di
+msgid "rrule_on"
+msgstr ""
+
 #: overrideTranslations
 # defaultMessage: di
 msgid "rrule_on the"
@@ -3297,6 +3307,11 @@ msgstr ""
 msgid "search_endDate"
 msgstr ""
 
+#: components/ItaliaTheme/View/FAQ/FaqFolder/SearchBar
+# defaultMessage: Search icon
+msgid "search_icon"
+msgstr ""
+
 #: components/ItaliaTheme/Blocks/SearchSections/SideBar
 # defaultMessage: Dove cercare
 msgid "search_sections"

package/locales/en/LC_MESSAGES/volto.po

@@ -104,6 +104,11 @@ msgstr "Search by topic"
 msgid "Cerca per parola chiave"
 msgstr "Search by keyword"
 
+#: overrideTranslations
+# defaultMessage: Pulisci i campi
+msgid "Clear dates"
+msgstr ""
+
 #: helpers/Translations/searchBlockExtendedTranslations
 # defaultMessage: Clear filters
 msgid "Clear filters"
@@ -2992,6 +2997,11 @@ msgstr "in"
 msgid "rrule_nd"
 msgstr "nd"
 
+#: overrideTranslations
+# defaultMessage: di
+msgid "rrule_on"
+msgstr "on"
+
 #: overrideTranslations
 # defaultMessage: di
 msgid "rrule_on the"
@@ -3282,6 +3292,11 @@ msgstr "Types"
 msgid "search_endDate"
 msgstr ""
 
+#: components/ItaliaTheme/View/FAQ/FaqFolder/SearchBar
+# defaultMessage: Search icon
+msgid "search_icon"
+msgstr ""
+
 #: components/ItaliaTheme/Blocks/SearchSections/SideBar
 # defaultMessage: Dove cercare
 msgid "search_sections"

package/locales/es/LC_MESSAGES/volto.po

@@ -113,6 +113,11 @@ msgstr "Buscar por tema"
 msgid "Cerca per parola chiave"
 msgstr "Buscar por palabra clave"
 
+#: overrideTranslations
+# defaultMessage: Pulisci i campi
+msgid "Clear dates"
+msgstr ""
+
 #: helpers/Translations/searchBlockExtendedTranslations
 # defaultMessage: Clear filters
 msgid "Clear filters"
@@ -3001,6 +3006,11 @@ msgstr ""
 msgid "rrule_nd"
 msgstr ""
 
+#: overrideTranslations
+# defaultMessage: di
+msgid "rrule_on"
+msgstr ""
+
 #: overrideTranslations
 # defaultMessage: di
 msgid "rrule_on the"
@@ -3291,6 +3301,11 @@ msgstr "Tipo de elementos"
 msgid "search_endDate"
 msgstr "Fecha de fin"
 
+#: components/ItaliaTheme/View/FAQ/FaqFolder/SearchBar
+# defaultMessage: Search icon
+msgid "search_icon"
+msgstr ""
+
 #: components/ItaliaTheme/Blocks/SearchSections/SideBar
 # defaultMessage: Dove cercare
 msgid "search_sections"

package/locales/fr/LC_MESSAGES/volto.po

@@ -121,6 +121,11 @@ msgstr "Recherche par sujet"
 msgid "Cerca per parola chiave"
 msgstr "Recherche par mots-clés"
 
+#: overrideTranslations
+# defaultMessage: Pulisci i campi
+msgid "Clear dates"
+msgstr ""
+
 #: helpers/Translations/searchBlockExtendedTranslations
 # defaultMessage: Clear filters
 msgid "Clear filters"
@@ -3009,6 +3014,11 @@ msgstr ""
 msgid "rrule_nd"
 msgstr ""
 
+#: overrideTranslations
+# defaultMessage: di
+msgid "rrule_on"
+msgstr ""
+
 #: overrideTranslations
 # defaultMessage: di
 msgid "rrule_on the"
@@ -3299,6 +3309,11 @@ msgstr "Type d'éléments"
 msgid "search_endDate"
 msgstr "Date de fin"
 
+#: components/ItaliaTheme/View/FAQ/FaqFolder/SearchBar
+# defaultMessage: Search icon
+msgid "search_icon"
+msgstr ""
+
 #: components/ItaliaTheme/Blocks/SearchSections/SideBar
 # defaultMessage: Dove cercare
 msgid "search_sections"

package/locales/it/LC_MESSAGES/volto.po

@@ -104,6 +104,11 @@ msgstr "Cerca per argomento"
 msgid "Cerca per parola chiave"
 msgstr "Cerca per parola chiave"
 
+#: overrideTranslations
+# defaultMessage: Pulisci i campi
+msgid "Clear dates"
+msgstr ""
+
 #: helpers/Translations/searchBlockExtendedTranslations
 # defaultMessage: Clear filters
 msgid "Clear filters"
@@ -2992,10 +2997,15 @@ msgstr "il giorno"
 msgid "rrule_nd"
 msgstr " "
 
+#: overrideTranslations
+# defaultMessage: di
+msgid "rrule_on"
+msgstr "di"
+
 #: overrideTranslations
 # defaultMessage: di
 msgid "rrule_on the"
-msgstr "il giorno"
+msgstr "di"
 
 #: overrideTranslations
 # defaultMessage: _
@@ -3282,6 +3292,11 @@ msgstr "Tipologia"
 msgid "search_endDate"
 msgstr "Data fine"
 
+#: components/ItaliaTheme/View/FAQ/FaqFolder/SearchBar
+# defaultMessage: Search icon
+msgid "search_icon"
+msgstr "Icona cerca"
+
 #: components/ItaliaTheme/Blocks/SearchSections/SideBar
 # defaultMessage: Dove cercare
 msgid "search_sections"

package/locales/volto.pot

@@ -1,7 +1,7 @@
 msgid ""
 msgstr ""
 "Project-Id-Version: Plone\n"
-"POT-Creation-Date: 2024-05-02T09:19:12.781Z\n"
+"POT-Creation-Date: 2024-05-15T15:55:46.048Z\n"
 "Last-Translator: Plone i18n <plone-i18n@lists.sourceforge.net>\n"
 "Language-Team: Plone i18n <plone-i18n@lists.sourceforge.net>\n"
 "MIME-Version: 1.0\n"
@@ -106,6 +106,11 @@ msgstr ""
 msgid "Cerca per parola chiave"
 msgstr ""
 
+#: overrideTranslations
+# defaultMessage: Pulisci i campi
+msgid "Clear dates"
+msgstr ""
+
 #: helpers/Translations/searchBlockExtendedTranslations
 # defaultMessage: Clear filters
 msgid "Clear filters"
@@ -2994,6 +2999,11 @@ msgstr ""
 msgid "rrule_nd"
 msgstr ""
 
+#: overrideTranslations
+# defaultMessage: di
+msgid "rrule_on"
+msgstr ""
+
 #: overrideTranslations
 # defaultMessage: di
 msgid "rrule_on the"
@@ -3284,6 +3294,11 @@ msgstr ""
 msgid "search_endDate"
 msgstr ""
 
+#: components/ItaliaTheme/View/FAQ/FaqFolder/SearchBar
+# defaultMessage: Search icon
+msgid "search_icon"
+msgstr ""
+
 #: components/ItaliaTheme/Blocks/SearchSections/SideBar
 # defaultMessage: Dove cercare
 msgid "search_sections"

package/package.json

@@ -2,8 +2,12 @@
   "name": "design-comuni-plone-theme",
   "description": "Volto Theme for Italia design guidelines",
   "license": "GPL-v3",
-  "version": "11.11.2",
+  "version": "11.12.1",
   "main": "src/index.js",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/RedTurtle/design-comuni-plone-theme"
+  },
   "keywords": [
     "volto-addon",
     "volto",
@@ -147,7 +151,7 @@
     "volto-dropdownmenu": "4.1.1",
     "volto-editablefooter": "5.1.1",
     "volto-feedback": "0.3.0",
-    "volto-form-block": "3.7.2",
+    "volto-form-block": "3.8.3",
     "volto-gdpr-privacy": "2.2.5",
     "volto-google-analytics": "2.0.0",
     "volto-multilingual-widget": "3.2.1",

package/publiccode.yml

@@ -227,9 +227,9 @@ maintenance:
 name: io-Comune - Il sito AgID per Comuni ed Enti Pubblici
 platforms:
   - web
-releaseDate: '2024-05-02'
+releaseDate: '2024-05-21'
 softwareType: standalone/web
-softwareVersion: 11.11.2
+softwareVersion: 11.12.1
 url: 'https://github.com/italia/design-comuni-plone-theme'
 usedBy:
   - ASP Comuni Modenesi Area Nord

package/src/components/ItaliaTheme/Blocks/IconBlocks/Block/ViewBlock.jsx

@@ -10,7 +10,6 @@ import { useIntl, defineMessages } from 'react-intl';
 import { UniversalLink } from '@plone/volto/components';
 
 import { Icon } from 'design-comuni-plone-theme/components/ItaliaTheme';
-import { RichTextRender } from 'design-comuni-plone-theme/components/ItaliaTheme/View';
 import { Card, CardBody, CardReadMore } from 'design-react-kit';
 import config from '@plone/volto/registry';
 
@@ -51,7 +50,7 @@ const ViewBlock = ({ data, isOpen, toggle, id, index }) => {
       <CardBody tag="div">
         {data.icon?.length > 0 && (
           <div className="iconblock-icon">
-            <Icon icon={data.icon} aria-hidden={true} />
+            <Icon icon={data.icon} aria-hidden={true} title={cardTitle} />
           </div>
         )}
 

package/src/components/ItaliaTheme/Blocks/Listing/Commons/ListingImage.jsx

@@ -1,3 +1,4 @@
+import { UniversalLink } from '@plone/volto/components';
 import DefaultImageSVG from '@plone/volto/components/manage/Blocks/Listing/default-image.svg';
 import { flattenToAppURL } from '@plone/volto/helpers';
 import config from '@plone/volto/registry';
@@ -15,9 +16,9 @@ const ListingImage = ({
   const Image = config.getComponent({ name: 'Image' }).component;
   let commonImageProps = {
     item,
-    'aria-hidden': true,
-    alt: imageProps.alt ?? '',
-    role: 'presentation',
+    'aria-hidden': imageProps.alt || item.title ? false : true,
+    alt: imageProps.alt ?? item.title ?? '',
+    role: imageProps.alt || item.title ? '' : 'presentation',
     className,
     loading,
     responsive,
@@ -28,7 +29,10 @@ const ListingImage = ({
     commonImageProps = { ...commonImageProps, title: item.title };
   // photogallery needs to check for null image
   // https://stackoverflow.com/questions/33136399/is-there-a-way-to-tell-if-reactelement-renders-null
-  const image = Image(commonImageProps);
+
+  const image = (
+    <UniversalLink item={item}>{Image(commonImageProps)}</UniversalLink>
+  );
   if (image === null)
     return showDefault ? <img src={DefaultImageSVG} alt="" /> : null;
 

package/src/components/ItaliaTheme/Blocks/Listing/SmallBlockLinksTemplate.jsx

@@ -42,6 +42,7 @@ const SmallBlockLinksTemplate = ({
               item,
               sizes: '(max-width:575px) 520px, 200px',
               style: {},
+              alt: item.title,
             });
 
             return (

package/src/components/ItaliaTheme/Breadcrumbs/Breadcrumbs.jsx

@@ -12,7 +12,11 @@ import { matchPath } from 'react-router';
 import { useLocation } from 'react-router-dom';
 import { isEqual, isEmpty } from 'lodash';
 import { getBreadcrumbs } from '@plone/volto/actions';
-import { getBaseUrl, flattenToAppURL } from '@plone/volto/helpers';
+import {
+  getBaseUrl,
+  flattenToAppURL,
+  hasApiExpander,
+} from '@plone/volto/helpers';
 
 import { UniversalLink } from '@plone/volto/components';
 import { Row, Col, BreadcrumbItem } from 'design-react-kit';
@@ -73,13 +77,15 @@ const Breadcrumbs = ({ pathname }) => {
   /** fine della gestione delle rotte statiche */
 
   useEffect(() => {
-    let actualPathForBreadcrumbs = pathname;
-    const { path, buildFullNavTree } = getCurrentPathFromAddonRoutes();
-    if (buildFullNavTree) {
-      const replacedPath = path.replace('**/', '');
-      actualPathForBreadcrumbs = pathname.replace(replacedPath, '');
+    if (!hasApiExpander('breadcrumbs', getBaseUrl(pathname))) {
+      let actualPathForBreadcrumbs = pathname;
+      const { path, buildFullNavTree } = getCurrentPathFromAddonRoutes();
+      if (buildFullNavTree) {
+        const replacedPath = path.replace('**/', '');
+        actualPathForBreadcrumbs = pathname.replace(replacedPath, '');
+      }
+      dispatch(getBreadcrumbs(getBaseUrl(actualPathForBreadcrumbs)));
     }
-    dispatch(getBreadcrumbs(getBaseUrl(actualPathForBreadcrumbs)));
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [pathname]);
 

package/src/components/ItaliaTheme/Header/HeaderSlim/TertiaryMenu.jsx

@@ -26,7 +26,7 @@ const TertiaryMenu = () => {
       return {
         url: item.href || flattenToAppURL(item.linkUrl?.[0]?.['@id']) || '/',
         title: item.title,
-        inEvidence:item.inEvidence
+        inEvidence: item.inEvidence,
       };
     });
 

package/src/components/ItaliaTheme/Icons/FontAwesomeIcon.jsx

@@ -36,10 +36,10 @@ const FontAwesomeIcon = (props) => {
       prefixKey === 'fab'
         ? 'brands'
         : prefixKey === 'far'
-        ? 'regular'
-        : prefixKey != null
-        ? prefixKey
-        : 'solid',
+          ? 'regular'
+          : prefixKey != null
+            ? prefixKey
+            : 'solid',
       iconName,
     ];
   };

package/src/components/ItaliaTheme/Pagination/Pagination.jsx

@@ -81,6 +81,9 @@ class Pagination extends Component {
       totalPages,
     });
 
+    const inactivePrevButton = activePage === 1;
+    const inactiveForwButton = activePage === this.props.totalPages;
+
     return (
       <Pager
         className="justify-content-center mt-5"
@@ -96,6 +99,8 @@ class Pagination extends Component {
                   onClick={this.handleItemClick}
                   type={type}
                   ellipsisItem={ellipsisItem}
+                  isPrevButtonInactive={inactivePrevButton}
+                  isForwButtonInactive={inactiveForwButton}
                 >
                   {value}
                 </PaginationItem>

package/src/components/ItaliaTheme/Pagination/PaginationItem.jsx

@@ -1,4 +1,5 @@
 import React from 'react';
+import cx from 'classnames';
 import _ from 'lodash';
 import keyboardKey from 'keyboard-key';
 import PropTypes from 'prop-types';
@@ -50,6 +51,9 @@ class PaginationItem extends Component {
       'nextItem',
       'lastItem',
     ]),
+
+    isPrevButtonInactive: PropTypes.bool,
+    isForwButtonInactive: PropTypes.bool,
   };
 
   handleClick = (e) => {
@@ -63,7 +67,15 @@ class PaginationItem extends Component {
   };
 
   render() {
-    const { active, type, children, intl, ellipsisItem } = this.props;
+    const {
+      active,
+      type,
+      children,
+      intl,
+      ellipsisItem,
+      isPrevButtonInactive,
+      isForwButtonInactive,
+    } = this.props;
     const disabled = this.props.disabled || type === 'ellipsisItem';
     return (
       <PagerItem disabled={disabled}>
@@ -79,6 +91,7 @@ class PaginationItem extends Component {
                 icon="it-chevron-left"
                 style={{ ariaHidden: true }}
                 color="primary"
+                className={cx({ disabled: isPrevButtonInactive })}
                 title={intl.formatMessage(messages.prevPage)}
               />
 
@@ -93,6 +106,7 @@ class PaginationItem extends Component {
                 icon="it-chevron-right"
                 style={{ ariaHidden: true }}
                 color="primary"
+                className={cx({ disabled: isForwButtonInactive })}
                 title={intl.formatMessage(messages.nextPage)}
               />
               <span className="visually-hidden">

package/src/components/ItaliaTheme/Slider/SingleSlideWrapper.jsx

@@ -12,6 +12,7 @@ const SingleSlideWrapper = (props) => {
   const wrapperKey = key ?? 'slide-wrapper-' + index;
 
   return (
+    // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions
     <div
       className={`it-single-slide-wrapper ${className ?? ''}`}
       key={wrapperKey}
@@ -30,6 +31,7 @@ const SingleSlideWrapper = (props) => {
         //e.preventDefault();
         //e.stopPropagation();
       }}
+      // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex
       tabIndex={0}
     >
       {children}

package/src/components/ItaliaTheme/View/Commons/PageHeader/PageHeaderBando.jsx

@@ -48,6 +48,9 @@ const PageHeaderBando = ({ content }) => {
                 }
                 padding={false}
                 size=""
+                title={`${intl.formatMessage(messages.bando)} ${
+                  content.bando_state[1]
+                }`}
               />
               {intl.formatMessage(messages.bando)}{' '}
               <BandoStatus content={content} />

package/src/components/ItaliaTheme/View/Commons/PageHeader/PageHeaderTassonomiaArgomenti.jsx

@@ -3,7 +3,7 @@ import { defineMessages, useIntl } from 'react-intl';
 import PropTypes from 'prop-types';
 import { Chip, ChipLabel } from 'design-react-kit';
 
-import { flattenToAppURL } from '@plone/volto/helpers';
+import { UniversalLink } from '@plone/volto/components';
 
 /**
  * PageHeaderTassonomiaArgomenti view component class.
@@ -28,17 +28,16 @@ const PageHeaderTassonomiaArgomenti = ({ content }) => {
         <small>{intl.formatMessage(messages.topics)}</small>
       </h5>
       {content.tassonomia_argomenti.map((item, i) => (
-        <a
-          href={flattenToAppURL(item['@id'])}
+        <UniversalLink
+          item={item}
           key={item['@id']}
-          title={item.title}
           className="text-decoration-none me-2 d-inline-block"
           data-element="service-topic"
         >
           <Chip color="primary" disabled={false} large={false} simple tag="div">
             <ChipLabel tag="span">{item.title}</ChipLabel>
           </Chip>
-        </a>
+        </UniversalLink>
       ))}
     </div>
   ) : null;

package/src/components/ItaliaTheme/View/DocumentoView/DocumentoAccedereServizio.jsx

@@ -2,7 +2,6 @@ import React from 'react';
 import { defineMessages, useIntl } from 'react-intl';
 
 import {
-  RichText,
   RichTextSection,
   GenericCard,
 } from 'design-comuni-plone-theme/components/ItaliaTheme/View';
@@ -24,13 +23,11 @@ const DocumentoAccedereServizio = ({ content }) => {
     >
       <div className="card-wrapper card-teaser-wrapper card-teaser-wrapper-equal">
         {content.servizi_collegati?.map((servizio, i) => (
-          <GenericCard key={servizio['@id']} item={servizio} showimage={false}>
-            <RichText
-              serif={false}
-              data={servizio.canale_digitale}
-              add_class="mt-3"
-            />
-          </GenericCard>
+          <GenericCard
+            key={servizio['@id']}
+            item={servizio}
+            showimage={false}
+          ></GenericCard>
         ))}
       </div>
     </RichTextSection>

package/src/components/ItaliaTheme/View/FAQ/FaqFolder/SearchBar.jsx

@@ -14,6 +14,10 @@ const messages = defineMessages({
     id: 'faq_search',
     defaultMessage: 'Type in a keyword to find answers',
   },
+  search_icon: {
+    id: 'search_icon',
+    defaultMessage: 'Search icon',
+  },
 });
 
 /**
@@ -41,6 +45,7 @@ const SearchBar = ({ searchableText, setSearchableText }) => {
                   style={{
                     ariaHidden: true,
                   }}
+                  title={intl.formatMessage(messages.search_icon)}
                 />
               </div>
             </div>

package/src/components/ItaliaTheme/View/PersonaView/PersonaDocumenti.jsx

@@ -205,7 +205,6 @@ const PersonaDocumenti = ({ content }) => {
           />
         </RichTextSection>
       )}
-
     </>
   );
 };

package/src/components/ItaliaTheme/View/ServizioView/ServizioCondizioni.jsx

@@ -30,7 +30,11 @@ const ServizioCondizioni = ({ content }) => {
           data-element="service-file"
         >
           <span className="list-item-title-icon-wrapper">
-            <Icon icon="it-clip" className="icon-primary me-1" />
+            <Icon
+              icon="it-clip"
+              className="icon-primary me-1"
+              title={intl.formatMessage(messages.condizioni_link)}
+            />
             {intl.formatMessage(messages.condizioni_link)} (
             {label ? <span className="text-uppercase">{label} </span> : ''}
             <span className="list-item">

package/src/components/ItaliaTheme/View/UOView/UOServices.jsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useState } from 'react';
 import { defineMessages, useIntl } from 'react-intl';
 import {
   Row,
@@ -9,6 +9,7 @@ import {
   CardTitle,
   CardText,
 } from 'design-react-kit';
+import { Pagination } from 'design-comuni-plone-theme/components/ItaliaTheme';
 import { UniversalLink } from '@plone/volto/components';
 
 const messages = defineMessages({
@@ -18,9 +19,35 @@ const messages = defineMessages({
   },
 });
 
+//* Pagination **/
+const divideServicesIntoBatches = (arr, batchSize) => {
+  const batches = [];
+  for (let i = 0; i < arr.length; i += batchSize) {
+    batches.push(arr.slice(i, i + batchSize));
+  }
+  return batches;
+};
+
 const UOServices = ({ content }) => {
   const intl = useIntl();
 
+  const [currentPage, setCurrentPage] = useState(1);
+  const bSize = 4;
+
+  //* Calcolo numero pagine
+
+  const servizi_offerti =
+    content.servizi_offerti === undefined || content.servizi_offerti === null
+      ? []
+      : content.servizi_offerti;
+
+  const pageNumbers = Math.ceil(servizi_offerti.length / bSize);
+
+  const onPaginationChange = (activePage) => {
+    const current = activePage?.children ?? 1;
+    setCurrentPage(current);
+  };
+
   return content?.servizi_offerti?.length > 0 ? (
     <section
       id={'servizi_offerti'}
@@ -30,7 +57,9 @@ const UOServices = ({ content }) => {
         {intl.formatMessage(messages.servizi_offerti)}
       </h2>
       <Row className="card-wrapper card-teaser-wrapper align-items-stretch">
-        {content?.servizi_offerti?.map((servizio, i) => (
+        {divideServicesIntoBatches(content?.servizi_offerti, bSize)[
+          currentPage - 1
+        ]?.map((servizio, i) => (
           <Col xs="12" lg="6">
             <Card className="shadow rounded card-big-io-comune p-3 my-3">
               <CardBody>
@@ -46,6 +75,13 @@ const UOServices = ({ content }) => {
           </Col>
         ))}
       </Row>
+      <div className="pagination-wrapper">
+        <Pagination
+          activePage={currentPage}
+          totalPages={pageNumbers}
+          onPageChange={(e, { activePage }) => onPaginationChange(activePage)}
+        />
+      </div>
     </section>
   ) : null;
 };

package/src/config/italiaConfig.js

@@ -66,8 +66,8 @@ import { schemaListing } from 'design-comuni-plone-theme/components/ItaliaTheme/
 
 import reducers from 'design-comuni-plone-theme/reducers';
 
-const ReleaseLog = loadable(() =>
-  import('design-comuni-plone-theme/components/ReleaseLog/ReleaseLog'),
+const ReleaseLog = loadable(
+  () => import('design-comuni-plone-theme/components/ReleaseLog/ReleaseLog'),
 );
 
 const messages = defineMessages({

package/src/customizations/volto/components/manage/Blocks/Search/components/DateRangeFacet.jsx

@@ -22,6 +22,10 @@ const messages = defineMessages({
     id: 'End Date',
     defaultMessage: 'End Date',
   },
+  clearDates: {
+    id: 'Clear dates',
+    defaultMessage: 'Pulisci i campi',
+  },
 });
 
 const PrevIcon = () => (
@@ -64,7 +68,17 @@ const customArrowIcon = (props) => {
   );
 };
 
-const CloseIcon = () => <Icon icon="it-close" size="24px" className="close" />;
+const CloseIcon = (props) => {
+  const { intl } = props;
+  return (
+    <Icon
+      icon="it-close"
+      size="24px"
+      className="close"
+      title={intl.formatMessage(messages.clearDates)}
+    />
+  );
+};
 
 const DateRangeFacet = (props) => {
   const { facet, isEditMode, onChange, value, reactDates, intl, lang } = props;
@@ -89,7 +103,7 @@ const DateRangeFacet = (props) => {
             disabled={isEditMode}
             noBorder
             showClearDates
-            customCloseIcon={<CloseIcon />}
+            customCloseIcon={<CloseIcon {...props} />}
             displayFormat={moment.localeData(lang).longDateFormat('L')}
             focusedInput={focused}
             onFocusChange={(focusedInput) => setFocused(focusedInput)}

package/src/customizations/volto/components/manage/UniversalLink/UniversalLink.jsx

@@ -126,7 +126,9 @@ const UniversalLink = ({
           config.settings.siteProperties.markSpecialLinks && (
             <Icon
               icon="it-external-link"
-              title={title}
+              title={`${title ? title + ' - ' : ''}${intl.formatMessage({
+                id: 'opensInNewTab',
+              })}`}
               size="xs"
               className="ms-1 align-sub external-link"
             />

package/src/customizations/volto-form-block/components/FormResult.jsx

@@ -0,0 +1,78 @@
+/*
+CUSTOMIZATIONS:
+- used design-react-kit components to render form result
+*/
+import React from 'react';
+import { useIntl, defineMessages } from 'react-intl';
+import { Button, Alert } from 'design-react-kit';
+import { getFieldName } from 'volto-form-block/components/utils';
+
+const messages = defineMessages({
+  success: {
+    id: 'form_submit_success',
+    defaultMessage: 'Sent!',
+  },
+  reset: {
+    id: 'form_reset',
+    defaultMessage: 'Clear',
+  },
+});
+
+const alertTransition = {
+  appear: true,
+  baseClass: 'fade',
+  baseClassActive: 'show',
+  enter: true,
+  exit: true,
+  in: true,
+  mountOnEnter: false,
+  tag: 'div',
+  timeout: 150,
+  unmountOnExit: true,
+};
+
+/* Function that replaces variables from the user customized message  */
+const replaceMessage = (text, sent_data) => {
+  let i = 0;
+  while (i < sent_data.length) {
+    let idField = getFieldName(sent_data[i].label, sent_data[i].field_id);
+    text = text.replaceAll('${' + idField + '}', sent_data[i].value ?? '');
+    i++;
+  }
+  text = text.replaceAll(/\$\{[^}]*\}/gm, ''); //replace empty fields with nothing
+  text = text.replaceAll('\n', '<br/>');
+  return text;
+};
+
+const FormResult = ({ formState, data, resetFormState }) => {
+  const intl = useIntl();
+  return (
+    <Alert color="success" fade isOpen tag="div" transition={alertTransition}>
+      <h4>{intl.formatMessage(messages.success)}</h4>
+      <br />
+      {/* Custom message */}
+      {data.send_message && (
+        <>
+          <p
+            dangerouslySetInnerHTML={{
+              __html: replaceMessage(data.send_message, formState.result.data),
+            }}
+          />
+          <br />
+        </>
+      )}
+      <Button
+        color="primary"
+        outline
+        onClick={(e) => {
+          e.preventDefault();
+          e.stopPropagation();
+          resetFormState();
+        }}
+      >
+        {intl.formatMessage(messages.reset)}
+      </Button>
+    </Alert>
+  );
+};
+export default FormResult;

package/src/customizations/volto-form-block/components/FormView.jsx

@@ -5,19 +5,17 @@
 */
 import React from 'react';
 import { useIntl, defineMessages } from 'react-intl';
-import {
-  Card,
-  CardBody,
-  Row,
-  Col,
-  Button,
-  Alert,
-  Progress,
-} from 'design-react-kit';
+import { Card, CardBody, Row, Col, Alert, Progress } from 'design-react-kit';
 // eslint-disable-next-line import/no-unresolved
 import { getFieldName } from 'volto-form-block/components/utils';
 // eslint-disable-next-line import/no-unresolved
 import Field from 'volto-form-block/components/Field';
+import {
+  OTPWidget,
+  OTP_FIELDNAME_EXTENDER,
+  Button,
+} from 'volto-form-block/components/Widget';
+import { FormResult } from 'volto-form-block/components';
 // eslint-disable-next-line import/no-unresolved
 import config from '@plone/volto/registry';
 
@@ -64,6 +62,8 @@ const FormView = ({
   captcha,
   id,
   getErrorMessage,
+  path,
+  block_id,
 }) => {
   const intl = useIntl();
   const alertTransition = {
@@ -86,23 +86,6 @@ const FormView = ({
     return formErrors?.filter((e) => e.field === field).length === 0;
   };
 
-  /* Function that replaces variables from the user customized message  */
-  const replaceMessage = (text) => {
-    let i = 0;
-    while (i < data.subblocks.length) {
-      let idField = getFieldName(
-        data.subblocks[i].label,
-        data.subblocks[i].field_id,
-      );
-      text = text.replaceAll(
-        '${' + idField + '}',
-        formData[idField]?.value || '',
-      );
-      i++;
-    }
-    return text;
-  };
-
   var FieldSchema = config.blocks.blocksConfig.form.fieldSchema;
   var fieldSchemaProperties = FieldSchema()?.properties;
   var fields_to_send = [];
@@ -117,6 +100,26 @@ const FormView = ({
     onSubmit(e);
   };
 
+  const getFieldsToSendWithValue = (subblock) => {
+    var fields_to_send = [];
+    var fieldSchemaProperties = FieldSchema(subblock)?.properties;
+    for (var key in fieldSchemaProperties) {
+      if (fieldSchemaProperties[key].send_to_backend) {
+        fields_to_send.push(key);
+      }
+    }
+
+    var fields_to_send_with_value = Object.assign(
+      {},
+      ...fields_to_send.map((field) => {
+        return {
+          [field]: subblock[field],
+        };
+      }),
+    );
+    return fields_to_send_with_value;
+  };
+
   return (
     <div className="block form">
       <div className="public-ui">
@@ -128,38 +131,11 @@ const FormView = ({
           <Card className="card-bg rounded py-3" noWrapper={false} tag="div">
             <CardBody tag="div">
               {formState.result ? (
-                <Alert
-                  color="success"
-                  fade
-                  isOpen
-                  tag="div"
-                  transition={alertTransition}
-                >
-                  <h4>{intl.formatMessage(messages.success)}</h4>
-                  <br />
-                  {/* Custom message */}
-                  {data.send_message && (
-                    <>
-                      <p
-                        dangerouslySetInnerHTML={{
-                          __html: replaceMessage(data.send_message),
-                        }}
-                      />
-                      <br />
-                    </>
-                  )}
-                  <Button
-                    color="primary"
-                    outline
-                    onClick={(e) => {
-                      e.preventDefault();
-                      e.stopPropagation();
-                      resetFormState();
-                    }}
-                  >
-                    {intl.formatMessage(messages.reset)}
-                  </Button>
-                </Alert>
+                <FormResult
+                  formState={formState}
+                  data={data}
+                  resetFormState={resetFormState}
+                />
               ) : (
                 <form
                   onSubmit={submit}
@@ -201,14 +177,8 @@ const FormView = ({
                   )}
                   {data.subblocks.map((subblock, index) => {
                     let name = getFieldName(subblock.label, subblock.id);
-                    var fields_to_send_with_value = Object.assign(
-                      {},
-                      ...fields_to_send.map((field) => {
-                        return {
-                          [field]: subblock[field],
-                        };
-                      }),
-                    );
+                    const fields_to_send_with_value =
+                      getFieldsToSendWithValue(subblock);
 
                     return (
                       <Row key={'row' + index}>
@@ -238,6 +208,49 @@ const FormView = ({
                     );
                   })}
 
+                  {/*OTP*/}
+                  {data.subblocks
+                    .filter((subblock) => subblock.use_as_bcc)
+                    .map((subblock, index) => {
+                      const fieldName = getFieldName(
+                        subblock.label,
+                        subblock.id,
+                      );
+                      const name = fieldName + OTP_FIELDNAME_EXTENDER;
+                      const fieldValue = formData[fieldName]?.value;
+                      const value = formData[fieldName]?.otp;
+                      const fields_to_send_with_value =
+                        getFieldsToSendWithValue(subblock);
+
+                      return (
+                        <Row key={'row_otp' + index}>
+                          <Col className="py-2">
+                            <OTPWidget
+                              {...subblock}
+                              fieldValue={fieldValue}
+                              onChange={(field, value) => {
+                                onChangeFormData(
+                                  subblock.id,
+                                  fieldName,
+                                  fieldValue,
+                                  {
+                                    ...fields_to_send_with_value,
+                                    otp: value,
+                                  },
+                                );
+                              }}
+                              value={value}
+                              valid={isValidField(name)}
+                              errorMessage={getErrorMessage(name)}
+                              formHasErrors={formErrors?.length > 0}
+                              path={path}
+                              block_id={block_id}
+                            />
+                          </Col>
+                        </Row>
+                      );
+                    })}
+
                   {enableCaptcha && <>{captcha.render()}</>}
 
                   {formErrors.length > 0 && (

package/src/customizations/volto-form-block/components/Widget/Button.jsx

@@ -0,0 +1,50 @@
+/**
+ * customizations:
+ * used design-react-kit button
+ *
+ *
+ * Button component.
+ * This is a wrapper for Buttons, to eventually customize Button component if you don't like to use semantic-ui, for example.
+ * @module components/Widget/OTPWidget
+ */
+
+import { Button as DesignButton } from 'design-react-kit';
+
+const Button = (props) => {
+  let _props = { ...props };
+  if (props.primary) {
+    _props.color = 'primary';
+    delete _props.primary;
+  }
+  if (props.secondary) {
+    _props.color = 'secondary';
+    delete _props.secondary;
+  }
+  if (props.basic) {
+    _props.outline = true;
+    delete _props.basic;
+  }
+  if (props.size) {
+    switch (props.size) {
+      case 'mini':
+      case 'tiny':
+      case 'small':
+        _props.size = 'xs';
+        break;
+      case 'medium':
+      case 'large':
+        _props.size = 'sm';
+        break;
+      case 'big':
+      case 'huge':
+      case 'massive':
+        _props.size = 'lg';
+        break;
+      default:
+        break;
+    }
+  }
+  return <DesignButton {..._props} />;
+};
+
+export default Button;

package/src/overrideTranslations.jsx

@@ -21,6 +21,10 @@ defineMessages({
     id: 'rrule_in',
     defaultMessage: 'il giorno',
   },
+  rrule_on: {
+    id: 'rrule_on',
+    defaultMessage: 'di',
+  },
   rrule_on_the: {
     id: 'rrule_on the',
     defaultMessage: 'di',
@@ -60,4 +64,8 @@ defineMessages({
     id: 'toggleMenu_close',
     defaultMessage: 'Chiudi',
   },
+  clearDates: {
+    id: 'Clear dates',
+    defaultMessage: 'Pulisci i campi',
+  },
 });

package/src/theme/ItaliaTheme/Blocks/_gridBlock.scss

@@ -52,6 +52,11 @@
         }
       }
     }
+
+    &.image img {
+      object-fit: contain;
+      object-position: center;
+    }
   }
 
   //in edit (cms-ui)

package/src/theme/ItaliaTheme/Components/_pager.scss

@@ -19,3 +19,13 @@
     }
   }
 }
+
+.pagination-wrapper {
+  li.page-item {
+    button.page-link {
+      .icon.icon-primary.disabled {
+        fill: $gray-600 !important;
+      }
+    }
+  }
+}

package/src/theme/ItaliaTheme/Views/_slider.scss

@@ -12,6 +12,7 @@
     &:focus {
       border: 1px solid;
     }
+
     figure {
       a {
         display: block;

package/src/theme/_site-variables.scss

@@ -16,7 +16,7 @@ $primary-text: #fff !default;
 $secondary-text: #fff !default;
 $tertiary: #be2816 !default;
 $tertiary-text: #fff !default;
-$highlight-search: #ff0 !default;
+$highlight-search: #ffff00 !default;
 $font-family-monospace-light: Roboto Mono Light !default;
 
 // Per abilitare l'header bianco impostare a true

package/src/theme/extras/_search.scss

@@ -89,6 +89,7 @@ body.search-modal-opened {
 
 .search-results-wrapper {
   mark.highlighted-text {
+    padding: 0em 0.1875em;
     background-color: $highlight-search;
   }
 
@@ -103,6 +104,10 @@ body.search-modal-opened {
           content: none;
         }
       }
+
+      .card-title {
+        line-height: 1.3em;
+      }
     }
   }