@plone/volto-slate 18.6.0 → 18.7.1

package/CHANGELOG.md

@@ -8,6 +8,18 @@
 
 <!-- towncrier release notes start -->
 
+## 18.7.1 (2025-10-10)
+
+### Bugfix
+
+- Fix Backspace at start of a text block: merge current block into previous inline (no extra newline), delete the current block, and place the caret before the first character of the merged content. Also handle Enter immediately after such inline merge by splitting back into two blocks. @aryan7081 [#7373](https://github.com/plone/volto/issues/7373)
+
+## 18.7.0 (2025-10-07)
+
+### Feature
+
+- Update translations: eu @erral [#7394](https://github.com/plone/volto/issues/7394)
+
 ## 18.6.0 (2025-09-26)
 
 ### Feature

package/locales/eu/LC_MESSAGES/volto.po

@@ -3,13 +3,14 @@ msgstr ""
 "Project-Id-Version: \n"
 "Report-Msgid-Bugs-To: \n"
 "POT-Creation-Date: \n"
-"PO-Revision-Date: \n"
-"Last-Translator: \n"
-"Language: \n"
-"Language-Team: \n"
+"PO-Revision-Date: 2025-09-23 17:01+0000\n"
+"Last-Translator: Mikel Larreategi <mlarreategi@codesyntax.com>\n"
+"Language-Team: Basque <https://hosted.weblate.org/projects/plone/volto-slate-18/eu/>\n"
+"Language: eu\n"
 "Content-Type: \n"
 "Content-Transfer-Encoding: \n"
-"Plural-Forms: \n"
+"Plural-Forms: nplurals=2; plural=n != 1;\n"
+"X-Generator: Weblate 5.14-dev\n"
 
 #: editor/plugins/Link/index
 msgid "Add link"
@@ -47,7 +48,7 @@ msgstr "Ezabatu taula"
 
 #: blocks/Table/TableBlockEdit
 msgid "Divide each row into separate cells"
-msgstr "Banatu lerro bakoitza gelaxka desberdinetan"
+msgstr "Zatitu lerro bakoitza zeldatan"
 
 #: elementEditor/messages
 msgid "Edit element"

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@plone/volto-slate",
-  "version": "18.6.0",
+  "version": "18.7.1",
   "description": "Slate.js integration with Volto",
   "main": "src/index.js",
   "author": "European Environment Agency: IDM2 A-Team",

package/src/blocks/Text/index.jsx

@@ -19,6 +19,7 @@ import {
   slashMenu,
   cancelEsc,
 } from './keyboard';
+import { splitAtSeam } from './keyboard/splitAtSeam';
 import { withDeleteSelectionOnEnter } from '@plone/volto-slate/editor/extensions';
 import {
   breakList,
@@ -66,6 +67,7 @@ export default function applyConfig(config) {
       Enter: [
         slashMenu,
         unwrapEmptyString,
+        splitAtSeam,
         softBreak, // Handles shift+Enter as a newline (<br/>)
       ],
       ArrowUp: [

package/src/blocks/Text/keyboard/joinBlocks.js

@@ -5,8 +5,8 @@ import { Editor } from 'slate';
 import {
   getPreviousVoltoBlock,
   getNextVoltoBlock,
-  mergeSlateWithBlockBackward,
   mergeSlateWithBlockForward,
+  mergeSlateWithBlockBackward,
 } from '@plone/volto-slate/utils/volto-blocks';
 import {
   isCursorAtBlockStart,
@@ -76,21 +76,22 @@ export function joinWithPreviousBlock({ editor, event }, intl) {
 
   // Else the editor contains characters, so we merge the current block's
   // `editor` with the block before, `otherBlock`.
-  const cursor = mergeSlateWithBlockBackward(editor, otherBlock);
+  const cursor = mergeSlateWithBlockBackward(editor, otherBlock, event);
 
-  const combined = JSON.parse(JSON.stringify(editor.children));
+  // Get the merged content from the editor
+  const merged = JSON.parse(JSON.stringify(editor.children));
 
   // // TODO: don't remove undo history, etc Should probably save both undo
   // // histories, so that the blocks are split, the undos can be restored??
 
   // const cursor = getBlockEndAsRange(otherBlock);
+
   const formData = changeBlock(properties, otherBlockId, {
     '@type': 'slate', // TODO: use a constant specified in src/constants.js instead of 'slate'
-    value: combined,
-    plaintext: serializeNodesToText(combined || []),
+    value: merged,
+    plaintext: serializeNodesToText(merged || []),
   });
   const newFormData = deleteBlock(formData, block, intl);
-
   ReactDOM.unstable_batchedUpdates(() => {
     saveSlateBlockSelection(otherBlockId, cursor);
     onChangeField(blocksFieldname, newFormData[blocksFieldname]);

package/src/blocks/Text/keyboard/splitAtSeam.js

@@ -0,0 +1,44 @@
+import ReactDOM from 'react-dom';
+import { Editor, Range } from 'slate';
+import { splitEditorInTwoFragments } from '@plone/volto-slate/utils/ops';
+import { setEditorContent } from '@plone/volto-slate/utils/editor';
+import { createAndSelectNewBlockAfter } from '@plone/volto-slate/utils/volto-blocks';
+
+/**
+ * Handle Enter after an inline Backspace-merge seam.
+ *
+ * Detects when the caret is at offset 0 of a leaf that is not the first
+ * leaf of a top-level node (e.g., after merging two blocks of same type),
+ * and splits the current Slate block into two Volto Slate blocks.
+ */
+export function splitAtSeam({ editor, event }, intl) {
+  const { selection } = editor;
+  if (!selection || !Range.isCollapsed(selection)) return;
+
+  const point = selection.anchor;
+  if (point.offset !== 0) return;
+
+  // We are interested in positions like [paragraphIndex, leafIndex]
+  // where leafIndex > 0 (caret at the beginning of a subsequent leaf)
+  if (!point.path || point.path.length < 2) return;
+
+  const leafIndex = point.path[1];
+  if (leafIndex <= 0) return; // first leaf, let default handlers run
+
+  // Ensure parent is a top-level block (parent path length 1)
+  const parentEntry = Editor.parent(editor, point);
+  if (!parentEntry) return;
+  const parentPath = parentEntry[1];
+  if (!parentPath || parentPath.length !== 1) return;
+
+  event.preventDefault();
+  event.stopPropagation();
+
+  ReactDOM.unstable_batchedUpdates(() => {
+    const [top, bottom] = splitEditorInTwoFragments(editor);
+    createAndSelectNewBlockAfter(editor, bottom, intl);
+    setEditorContent(editor, top);
+  });
+
+  return true;
+}

package/src/utils/selection.js

@@ -82,10 +82,8 @@ export function isCursorAtBlockStart(editor) {
 
   if (editor.selection && Range.isCollapsed(editor.selection)) {
     const { anchor } = editor.selection;
-    return anchor.offset > 0
-      ? false
-      : anchor.path.reduce((acc, x) => acc + x, 0) === 0;
-    // anchor.path.length === 2 &&
+    // Check if cursor is at offset 0 of any leaf node (not just the first one)
+    return anchor.offset === 0;
   }
   return false;
 }

package/src/utils/volto-blocks.js

@@ -8,7 +8,7 @@ import {
   getBlocksFieldname,
   getBlocksLayoutFieldname,
 } from '@plone/volto/helpers/Blocks/Blocks';
-import { Transforms, Editor, Node, Text, Path } from 'slate';
+import { Transforms, Editor, Node } from 'slate';
 import { serializeNodesToText } from '@plone/volto-slate/editor/render';
 import omit from 'lodash/omit';
 import config from '@plone/volto/registry';
@@ -21,74 +21,64 @@ function fromEntries(pairs) {
   return res;
 }
 
-// TODO: should be made generic, no need for "prevBlock.value"
 export function mergeSlateWithBlockBackward(editor, prevBlock, event) {
-  // To work around current architecture limitations, read the value from
-  // previous block. Replace it in the current editor (over which we have
-  // control), join with current block value, then use this result for previous
-  // block, delete current block
-
-  const prev = prevBlock.value;
-
-  // collapse the selection to its start point
-  Transforms.collapse(editor, { edge: 'start' });
-
-  let rangeRef;
-  let end;
-
-  Editor.withoutNormalizing(editor, () => {
-    // insert block #0 contents in block #1 contents, at the beginning
-    Transforms.insertNodes(editor, prev, {
-      at: Editor.start(editor, []),
-    });
-
-    // the contents that should be moved into the `ul`, as the last `li`
-    rangeRef = Editor.rangeRef(editor, {
-      anchor: Editor.start(editor, [1]),
-      focus: Editor.end(editor, [1]),
-    });
-
-    const source = rangeRef.current;
-
-    end = Editor.end(editor, [0]);
-
-    let endPoint;
-
-    Transforms.insertNodes(editor, { text: '' }, { at: end });
-
-    end = Editor.end(editor, [0]);
-
-    Transforms.splitNodes(editor, {
-      at: end,
-      always: true,
-      height: 1,
-      mode: 'highest',
-      match: (n) => n.type === 'li' || Text.isText(n),
-    });
-
-    endPoint = Editor.end(editor, [0]);
-
-    Transforms.moveNodes(editor, {
-      at: source,
-      to: endPoint.path,
-      mode: 'all',
-      match: (n, p) => p.length === 2,
-    });
-  });
+  // Merge the current block content into the previous block
+  // The current block content should be appended to the previous block
+  // and the cursor should be positioned at the start of what was the current block content
+
+  const prevValue = [...prevBlock.value];
+  const currentValue = [...editor.children];
+
+  const lastNode = prevValue[prevValue.length - 1];
+  const firstNode = currentValue[0];
+  let merged;
+  let cursor;
+
+  if (lastNode && firstNode && lastNode.type === firstNode.type) {
+    // If the last node of previous block and first node of current block have the same type,
+    // merge their children together
+    const mergedFirstNode = {
+      ...lastNode,
+      children: [...lastNode.children, ...firstNode.children],
+    };
 
-  const [n] = Editor.node(editor, [1]);
+    merged = [
+      ...prevValue.slice(0, -1),
+      mergedFirstNode,
+      ...currentValue.slice(1),
+    ];
 
-  if (Editor.isEmpty(editor, n)) {
-    Transforms.removeNodes(editor, { at: [1] });
+    cursor = {
+      anchor: {
+        path: [prevValue.length - 1, lastNode.children.length],
+        offset: 0,
+      },
+      focus: {
+        path: [prevValue.length - 1, lastNode.children.length],
+        offset: 0,
+      },
+    };
+  } else {
+    // Otherwise, just append the current block content to the previous block
+    merged = [...prevValue, ...currentValue];
+    // Position cursor at the start of the merged content (where current block was inserted)
+    // The current block content starts at index prevValue.length in the merged array
+    cursor = {
+      anchor: {
+        path: [prevValue.length, 0],
+        offset: 0,
+      },
+      focus: {
+        path: [prevValue.length, 0],
+        offset: 0,
+      },
+    };
   }
 
-  rangeRef.unref();
-
-  const [, lastPath] = Editor.last(editor, [0]);
-
-  end = Editor.start(editor, Path.parent(lastPath));
+  // Update the editor with the merged content
+  editor.children = merged;
 
-  return end;
+  return cursor;
 }
 
 export function mergeSlateWithBlockForward(editor, nextBlock, event) {