Improve block normalizing

src/blocks/Text/extensions/normalizeBlocks.js

@@ -1,6 +1,5 @@
-import { Text, Transforms, Element, Node } from 'slate';
+import { Text, Transforms, Element } from 'slate';
 import config from '@plone/volto/registry';
-import { deconstructToVoltoBlocks } from 'volto-slate/utils';
 
 export const normalizeBlocks = (editor) => {
   // enforce list rules (no block elements, only ol/ul/li as possible children
@@ -9,13 +8,6 @@ export const normalizeBlocks = (editor) => {
   const validListElements = [...slate.listTypes, slate.listItemType];
 
   editor.normalizeNode = (entry) => {
-    let isNormalizing = false;
-
-    if (!editor.voltoBlockNormalizing) {
-      editor.voltoBlockNormalizing = true;
-      isNormalizing = true;
-    }
-
     const [node, path] = entry;
 
     if (
@@ -25,38 +17,14 @@ export const normalizeBlocks = (editor) => {
       !validListElements.includes(node.type) &&
       path.length > 1
     ) {
-      console.log('not inline', node, path);
-      // Transforms.liftNodes(editor, { at: path, split: true });
-      //
-      // for (const [child, childPath] of Node.children(editor, path)) {
-      //   if (!validListElements.includes(child.type)) {
-      //     Transforms.liftNodes(editor, { at: childPath, split: true });
-      //     return;
-      //   }
-      // }
-    }
-    // if (node.type === 'ol' || node.type === 'ul') {
-    //   if (Element.isElement(node) && slate.listTypes.includes(node.type)) {
-    //     for (const [child, childPath] of Node.children(editor, path)) {
-    //       if (!validListElements.includes(child.type)) {
-    //         Transforms.liftNodes(editor, { at: childPath, split: true });
-    //         return;
-    //       }
-    //     }
-    //   }
-    // }
+      // Insert a space in the first element
+      const at = path[path.length] > 0 ? [...path, 0] : [...path, path.length];
+      Transforms.insertNodes(editor, { text: ' ' }, { at, mode: 'lowest' });
+      Transforms.unwrapNodes(editor, { at: path });
 
-    // if (node.type === slate.listItemType) {
-    //   console.log('node', node);
-    // }
-
-    normalizeNode(entry);
-
-    if (isNormalizing) {
-      editor.voltoBlockNormalizing = undefined;
-      // console.log('deconstruct', editor);
-      // deconstructToVoltoBlocks(editor);
+      return;
     }
+    normalizeNode(entry);
   };
 
   return editor;

src/blocks/Text/extensions/withLists.js

@@ -23,7 +23,7 @@ export const withLists = (editor) => {
         const liNodes = Array.from(Node.children(node, [])).filter(
           ([n, p]) => n.type === slate.listItemType,
         );
-        console.log('lis', liNodes);
+        // console.log('lis', liNodes);
 
         // if a node has a <li> but isn't an ul/ol, unwrap the <li>
         // // check if <li> has ul/ol parent

src/editor/config.jsx

@@ -30,7 +30,7 @@ import {
   withDeserializers,
 } from './extensions';
 import {
-  inlineTagDeserializer,
+  // inlineTagDeserializer,
   bodyTagDeserializer,
   blockTagDeserializer,
   preTagDeserializer,
@@ -219,6 +219,7 @@ export const elements = {
   s: ({ children }) => <s>{children}</s>,
   sub: ({ children }) => <sub>{children}</sub>,
   sup: ({ children }) => <sup>{children}</sup>,
+  code: ({ children }) => <code>{children}</code>,
 };
 
 export const inlineElements = [
@@ -230,13 +231,14 @@ export const inlineElements = [
   's',
   'sub',
   'sup',
+  'code',
 ];
 
 // Order of definition here is important (higher = inner element)
 export const leafs = {
-  code: ({ children }) => {
-    return <code>{children}</code>;
-  },
+  // code: ({ children }) => {
+  //   return <code>{children}</code>;
+  // },
 };
 
 export const defaultValue = () => {
@@ -266,7 +268,8 @@ export const htmlTagsToSlate = {
   // B: blockTagDeserializer('b'),
   B: bTagDeserializer,
   STRONG: blockTagDeserializer('strong'),
-  CODE: inlineTagDeserializer({ code: true }),
+  CODE: blockTagDeserializer('code'),
+  // CODE: inlineTagDeserializer({ code: true }),
   DEL: blockTagDeserializer('s'),
   EM: blockTagDeserializer('em'),
   I: blockTagDeserializer('i'),

src/editor/deserialize.js

@@ -93,6 +93,7 @@ export const blockTagDeserializer = (tagname) => (editor, el) => {
     children = [{ text: '' }];
   }
 
+  // console.log('children', children);
   return jsx('element', { type: tagname }, children);
 };
 

src/editor/extensions/insertData.js

@@ -27,11 +27,9 @@ export const insertData = (editor) => {
 
       let fragment; //  = deserialize(editor, body);
 
-      // console.log('deserialize body', body);
-      console.log('parsed body', parsed);
-
       const val = deserialize(editor, body);
-      console.log('val', val);
+      console.log('deserialized', { parsed, val });
+
       fragment = Array.isArray(val) ? val : [val];
 
       // When there's already text in the editor, insert a fragment, not nodes
@@ -47,7 +45,7 @@ export const insertData = (editor) => {
       }
 
       const nodes = normalizeBlockNodes(editor, fragment);
-      console.log('nodes', nodes);
+      // console.log('nodes', nodes);
       Transforms.insertNodes(editor, nodes);
 
       deconstructToVoltoBlocks(editor);