From da78fb2fb08a310781cb10207a168ff1c8621bc1 Mon Sep 17 00:00:00 2001
From: "sabrina.bongiovanni" <sabrina.bongiovanni@redturtle.it>
Date: Tue, 7 Oct 2025 12:55:58 +0200
Subject: [PATCH 1/2] fix: focus management in block edit

---
 RELEASE.md                                    |  14 ++
 locales/de/LC_MESSAGES/volto.po               |  10 ++
 locales/en/LC_MESSAGES/volto.po               |  10 ++
 locales/es/LC_MESSAGES/volto.po               |  10 ++
 locales/fr/LC_MESSAGES/volto.po               |  10 ++
 locales/it/LC_MESSAGES/volto.po               |  10 ++
 locales/volto.pot                             |  12 +-
 .../manage/Blocks/Block/EditBlockWrapper.jsx  | 130 ++++++++++++++++++
 src/overrideTranslations.jsx                  |   9 ++
 9 files changed, 214 insertions(+), 1 deletion(-)
 create mode 100644 src/customizations/volto/components/manage/Blocks/Block/EditBlockWrapper.jsx

diff --git a/RELEASE.md b/RELEASE.md
index 57a0ec50c..6990aa848 100644
--- a/RELEASE.md
+++ b/RELEASE.md
@@ -41,6 +41,20 @@
 - ...
  -->
 
+## Versione X.X.X (dd/mm/yyyy)
+
+### Migliorie
+
+- Migliorata la gestione del focus tra i blocchi in modalità di modifica.
+
+### Novità
+
+- ...
+
+### Fix
+
+- ...
+
 ## Versione 12.5.2 (03/10/2025)
 
 ### Fix
diff --git a/locales/de/LC_MESSAGES/volto.po b/locales/de/LC_MESSAGES/volto.po
index ddfe1df09..f161f53a4 100644
--- a/locales/de/LC_MESSAGES/volto.po
+++ b/locales/de/LC_MESSAGES/volto.po
@@ -1922,6 +1922,11 @@ msgstr ""
 msgid "deleghe"
 msgstr ""
 
+#: overrideTranslations
+# defaultMessage: delete {type} block
+msgid "delete_block"
+msgstr ""
+
 #: components/ItaliaTheme/manage/Widgets/ContactsWidget/ContactsConfigWidget
 # defaultMessage: Delete
 msgid "delete_button"
@@ -2083,6 +2088,11 @@ msgstr ""
 msgid "downloadPlayVideo"
 msgstr ""
 
+#: overrideTranslations
+# defaultMessage: drag {type} block
+msgid "drag_block"
+msgstr ""
+
 #: components/SelectInput/SelectInput
 # defaultMessage: Apri il menu
 msgid "dropdown_indicator"
diff --git a/locales/en/LC_MESSAGES/volto.po b/locales/en/LC_MESSAGES/volto.po
index 23a16c04c..a87eedb90 100644
--- a/locales/en/LC_MESSAGES/volto.po
+++ b/locales/en/LC_MESSAGES/volto.po
@@ -1907,6 +1907,11 @@ msgstr "Term effective date"
 msgid "deleghe"
 msgstr "Delegations"
 
+#: overrideTranslations
+# defaultMessage: delete {type} block
+msgid "delete_block"
+msgstr ""
+
 #: components/ItaliaTheme/manage/Widgets/ContactsWidget/ContactsConfigWidget
 # defaultMessage: Delete
 msgid "delete_button"
@@ -2068,6 +2073,11 @@ msgstr "Download"
 msgid "downloadPlayVideo"
 msgstr ""
 
+#: overrideTranslations
+# defaultMessage: drag {type} block
+msgid "drag_block"
+msgstr ""
+
 #: components/SelectInput/SelectInput
 # defaultMessage: Apri il menu
 msgid "dropdown_indicator"
diff --git a/locales/es/LC_MESSAGES/volto.po b/locales/es/LC_MESSAGES/volto.po
index 40f6a359d..4d42b2191 100644
--- a/locales/es/LC_MESSAGES/volto.po
+++ b/locales/es/LC_MESSAGES/volto.po
@@ -1916,6 +1916,11 @@ msgstr "Fecha límite"
 msgid "deleghe"
 msgstr "Delegaciones"
 
+#: overrideTranslations
+# defaultMessage: delete {type} block
+msgid "delete_block"
+msgstr ""
+
 #: components/ItaliaTheme/manage/Widgets/ContactsWidget/ContactsConfigWidget
 # defaultMessage: Delete
 msgid "delete_button"
@@ -2077,6 +2082,11 @@ msgstr "Descargar"
 msgid "downloadPlayVideo"
 msgstr ""
 
+#: overrideTranslations
+# defaultMessage: drag {type} block
+msgid "drag_block"
+msgstr ""
+
 #: components/SelectInput/SelectInput
 # defaultMessage: Apri il menu
 msgid "dropdown_indicator"
diff --git a/locales/fr/LC_MESSAGES/volto.po b/locales/fr/LC_MESSAGES/volto.po
index 554677d59..a0c25a6c4 100644
--- a/locales/fr/LC_MESSAGES/volto.po
+++ b/locales/fr/LC_MESSAGES/volto.po
@@ -1924,6 +1924,11 @@ msgstr "Date effective"
 msgid "deleghe"
 msgstr "Déléghe"
 
+#: overrideTranslations
+# defaultMessage: delete {type} block
+msgid "delete_block"
+msgstr ""
+
 #: components/ItaliaTheme/manage/Widgets/ContactsWidget/ContactsConfigWidget
 # defaultMessage: Delete
 msgid "delete_button"
@@ -2085,6 +2090,11 @@ msgstr "Télécharger"
 msgid "downloadPlayVideo"
 msgstr ""
 
+#: overrideTranslations
+# defaultMessage: drag {type} block
+msgid "drag_block"
+msgstr ""
+
 #: components/SelectInput/SelectInput
 # defaultMessage: Apri il menu
 msgid "dropdown_indicator"
diff --git a/locales/it/LC_MESSAGES/volto.po b/locales/it/LC_MESSAGES/volto.po
index e7c7d7fed..a8b78e532 100644
--- a/locales/it/LC_MESSAGES/volto.po
+++ b/locales/it/LC_MESSAGES/volto.po
@@ -1907,6 +1907,11 @@ msgstr "Decorrenza termine"
 msgid "deleghe"
 msgstr "Deleghe"
 
+#: overrideTranslations
+# defaultMessage: delete {type} block
+msgid "delete_block"
+msgstr "Elimina blocco {type}"
+
 #: components/ItaliaTheme/manage/Widgets/ContactsWidget/ContactsConfigWidget
 # defaultMessage: Delete
 msgid "delete_button"
@@ -2068,6 +2073,11 @@ msgstr "Scarica"
 msgid "downloadPlayVideo"
 msgstr "Scarica e riproduci video"
 
+#: overrideTranslations
+# defaultMessage: drag {type} block
+msgid "drag_block"
+msgstr "Trascina blocco {type}"
+
 #: components/SelectInput/SelectInput
 # defaultMessage: Apri il menu
 msgid "dropdown_indicator"
diff --git a/locales/volto.pot b/locales/volto.pot
index 50f979e0c..f558816e1 100644
--- a/locales/volto.pot
+++ b/locales/volto.pot
@@ -1,7 +1,7 @@
 msgid ""
 msgstr ""
 "Project-Id-Version: Plone\n"
-"POT-Creation-Date: 2025-10-02T13:26:14.817Z\n"
+"POT-Creation-Date: 2025-10-07T10:55:00.063Z\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"
@@ -1909,6 +1909,11 @@ msgstr ""
 msgid "deleghe"
 msgstr ""
 
+#: overrideTranslations
+# defaultMessage: delete {type} block
+msgid "delete_block"
+msgstr ""
+
 #: components/ItaliaTheme/manage/Widgets/ContactsWidget/ContactsConfigWidget
 # defaultMessage: Delete
 msgid "delete_button"
@@ -2070,6 +2075,11 @@ msgstr ""
 msgid "downloadPlayVideo"
 msgstr ""
 
+#: overrideTranslations
+# defaultMessage: drag {type} block
+msgid "drag_block"
+msgstr ""
+
 #: components/SelectInput/SelectInput
 # defaultMessage: Apri il menu
 msgid "dropdown_indicator"
diff --git a/src/customizations/volto/components/manage/Blocks/Block/EditBlockWrapper.jsx b/src/customizations/volto/components/manage/Blocks/Block/EditBlockWrapper.jsx
new file mode 100644
index 000000000..e8a7833df
--- /dev/null
+++ b/src/customizations/volto/components/manage/Blocks/Block/EditBlockWrapper.jsx
@@ -0,0 +1,130 @@
+import React from 'react';
+import { Icon } from '@plone/volto/components';
+import {
+  blockHasValue,
+  buildStyleClassNamesFromData,
+} from '@plone/volto/helpers';
+import dragSVG from '@plone/volto/icons/drag.svg';
+import { Button } from 'semantic-ui-react';
+import includes from 'lodash/includes';
+import isBoolean from 'lodash/isBoolean';
+import { defineMessages, injectIntl } from 'react-intl';
+import cx from 'classnames';
+import config from '@plone/volto/registry';
+import { BlockChooserButton } from '@plone/volto/components';
+
+import trashSVG from '@plone/volto/icons/delete.svg';
+
+const messages = defineMessages({
+  delete_block: {
+    id: 'delete_block',
+    defaultMessage: 'delete {type} block',
+  },
+  drag_block: {
+    id: 'drag_block',
+    defaultMessage: 'drag {type} block',
+  },
+});
+
+const EditBlockWrapper = (props) => {
+  const hideHandler = (data) => {
+    return (
+      !!data.fixed ||
+      (!config.experimental.addBlockButton.enabled &&
+        !(blockHasValue(data) && props.blockProps.editable))
+    );
+  };
+
+  const { intl, blockProps, draginfo, children } = props;
+  const {
+    allowedBlocks,
+    block,
+    blocksConfig,
+    selected,
+    type,
+    onChangeBlock,
+    onDeleteBlock,
+    onInsertBlock,
+    onSelectBlock,
+    onMutateBlock,
+    data,
+    editable,
+    properties,
+    showBlockChooser,
+  } = blockProps;
+  const visible = selected && !hideHandler(data);
+
+  const required = isBoolean(data.required)
+    ? data.required
+    : includes(config.blocks.requiredBlocks, type);
+
+  const styles = buildStyleClassNamesFromData(data.styles);
+
+  return (
+    <div
+      ref={draginfo.innerRef}
+      {...draginfo.draggableProps}
+      // Right now, we can have the alignment information in the styles property or in the
+      // block data root, we inject the classname here for having control over the whole
+      // Block Edit wrapper
+      className={cx(`block-editor-${data['@type']}`, styles, {
+        [data.align]: data.align,
+      })}
+    >
+      <div style={{ position: 'relative' }}>
+        <div
+          style={{
+            visibility: visible ? 'visible' : 'hidden',
+            display: 'inline-block',
+          }}
+          {...draginfo.dragHandleProps}
+          className="drag handle wrapper"
+          aria-label={intl.formatMessage(messages.drag_block, { type })}
+        >
+          <Icon name={dragSVG} size="18px" />
+        </div>
+        <div
+          className={`ui drag block inner ${type}`}
+          onFocus={(e) => {
+            if (!selected) {
+              onSelectBlock(block);
+            }
+          }}
+        >
+          {children}
+          {selected && !required && editable && (
+            <Button
+              icon
+              basic
+              onClick={() => onDeleteBlock(block, true)}
+              className="delete-button"
+              aria-label={intl.formatMessage(messages.delete_block, { type })}
+            >
+              <Icon name={trashSVG} size="18px" />
+            </Button>
+          )}
+          {config.experimental.addBlockButton.enabled && showBlockChooser && (
+            <BlockChooserButton
+              data={data}
+              block={block}
+              onInsertBlock={(id, value) => {
+                if (blockHasValue(data)) {
+                  onSelectBlock(onInsertBlock(id, value));
+                } else {
+                  onChangeBlock(id, value);
+                }
+              }}
+              onMutateBlock={onMutateBlock}
+              allowedBlocks={allowedBlocks}
+              blocksConfig={blocksConfig}
+              size="24px"
+              properties={properties}
+            />
+          )}
+        </div>
+      </div>
+    </div>
+  );
+};
+
+export default injectIntl(EditBlockWrapper);
diff --git a/src/overrideTranslations.jsx b/src/overrideTranslations.jsx
index fa5e8ce5f..66c1c80b4 100644
--- a/src/overrideTranslations.jsx
+++ b/src/overrideTranslations.jsx
@@ -37,6 +37,15 @@ defineMessages({
     id: 'rrule_weekday',
     defaultMessage: 'giorno feriale',
   },
+  // blocks
+  delete_block: {
+    id: 'delete_block',
+    defaultMessage: 'delete {type} block',
+  },
+  drag_block: {
+    id: 'drag_block',
+    defaultMessage: 'drag {type} block',
+  },
   //---- Volto-form-block ----//
   reset: {
     id: 'form_reset',

From 76120f78710dc9d2ec7f1e7ac1afdd9ed9da2a63 Mon Sep 17 00:00:00 2001
From: "sabrina.bongiovanni" <sabrina.bongiovanni@redturtle.it>
Date: Wed, 8 Oct 2025 12:23:06 +0200
Subject: [PATCH 2/2] chore: customization message

---
 .../volto/components/manage/Blocks/Block/EditBlockWrapper.jsx | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/src/customizations/volto/components/manage/Blocks/Block/EditBlockWrapper.jsx b/src/customizations/volto/components/manage/Blocks/Block/EditBlockWrapper.jsx
index e8a7833df..a14b40aa0 100644
--- a/src/customizations/volto/components/manage/Blocks/Block/EditBlockWrapper.jsx
+++ b/src/customizations/volto/components/manage/Blocks/Block/EditBlockWrapper.jsx
@@ -1,3 +1,7 @@
+// customization:
+// - 91-95 focus on block sets block as selected
+// - porting of specific block action aria-labels from Volto
+
 import React from 'react';
 import { Icon } from '@plone/volto/components';
 import {