@supernova-studio/client 0.33.0 → 0.35.0

package/src/yjs/docs-editor/prosemirror-to-blocks.ts

@@ -73,6 +73,10 @@ export function prosemirrorDocToPage(
   };
 }
 
+export function shallowProsemirrorNodeToBlock(prosemirrorNode: ProsemirrorNode, definition: PageBlockDefinition) {
+  return shallowProsemirrorNodeAndDefinitionToBlock(prosemirrorNode, definition);
+}
+
 //
 // Sections
 //
@@ -134,7 +138,7 @@ function prosemirrorNodeToSectionColumns(
 
   return {
     id: id,
-    blocks: internalProsemirrorNodesToBlocks(prosemirrorNode.content ?? [], definitionsMap),
+    blocks: internalProsemirrorNodesToBlocks(prosemirrorNode.content ?? [], definitionsMap, 0),
   };
 }
 
@@ -144,49 +148,49 @@ function prosemirrorNodeToSectionColumns(
 
 export function prosemirrorNodesToBlocks(prosemirrorNodes: ProsemirrorNode[], definitions: PageBlockDefinition[]) {
   const definitionsById = mapByUnique(definitions, d => d.id);
-  return internalProsemirrorNodesToBlocks(prosemirrorNodes, definitionsById);
+  return internalProsemirrorNodesToBlocks(prosemirrorNodes, definitionsById, 0);
 }
 
 function internalProsemirrorNodesToPageItems(
   prosemirrorNodes: ProsemirrorNode[],
   definitionsMap: Map<string, PageBlockDefinition>
 ): (PageBlockEditorModel | PageSectionEditorModel)[] {
-  return prosemirrorNodes
-    .map(prosemirrorNode => {
-      if (prosemirrorNode.type === "tabsSection") {
-        return prosemirrorNodeToSection(prosemirrorNode, Array.from(definitionsMap.values()));
-      } else {
-        return internalProsemirrorNodeToBlock(prosemirrorNode, definitionsMap);
-      }
-    })
-    .filter(nonNullFilter);
+  const result: (PageBlockEditorModel | PageSectionEditorModel)[] = [];
+
+  for (const prosemirrorNode of prosemirrorNodes) {
+    if (prosemirrorNode.type === "tabsSection") {
+      // Section
+      const section = prosemirrorNodeToSection(prosemirrorNode, Array.from(definitionsMap.values()));
+      section && result.push(section);
+    } else {
+      // Block
+      result.push(...internalProsemirrorNodeToBlock(prosemirrorNode, definitionsMap, 0));
+    }
+  }
+
+  return result;
 }
 
 function internalProsemirrorNodesToBlocks(
   prosemirrorNodes: ProsemirrorNode[],
-  definitionsMap: Map<string, PageBlockDefinition>
+  definitionsMap: Map<string, PageBlockDefinition>,
+  depth: number
 ): PageBlockEditorModel[] {
-  return prosemirrorNodes
-    .map(prosemirrorNode => {
-      return internalProsemirrorNodeToBlock(prosemirrorNode, definitionsMap);
-    })
-    .filter(nonNullFilter);
+  return prosemirrorNodes.flatMap(prosemirrorNode => {
+    return internalProsemirrorNodeToBlock(prosemirrorNode, definitionsMap, depth);
+  });
 }
 
 function internalProsemirrorNodeToBlock(
   prosemirrorNode: ProsemirrorNode,
-  definitionsMap: Map<string, PageBlockDefinition>
-) {
-  let definitionId = getProsemirrorAttribute(prosemirrorNode, "definitionId", z.string());
+  definitionsMap: Map<string, PageBlockDefinition>,
+  depth: number
+): PageBlockEditorModel[] {
+  const definitionId = getProsemirrorAttribute(prosemirrorNode, "definitionId", z.string());
   if (!definitionId) {
     console.warn(`definitionId on ${prosemirrorNode.type} is required to be interpreted as a block, skipping node`);
 
-    return null;
-  }
-
-  // TODO: remove
-  if (definitionId === "io.supernova.block.token-detail") {
-    definitionId = "io.supernova.block.token-list";
+    return [];
   }
 
   const definition = definitionsMap.get(definitionId);
@@ -195,13 +199,28 @@ function internalProsemirrorNodeToBlock(
       `Block definitionId "${definitionId}" (prosemirror node ${prosemirrorNode.type}) is not among available definitions`
     );
     console.warn(prosemirrorNode);
-    return null;
+    return [];
   }
 
-  return prosemirrorNodeToBlock(prosemirrorNode, definition);
+  return prosemirrorNodeAndDefinitionToBlock(prosemirrorNode, definition, definitionsMap, depth);
 }
 
-export function prosemirrorNodeToBlock(
+function prosemirrorNodeAndDefinitionToBlock(
+  prosemirrorNode: ProsemirrorNode,
+  definition: PageBlockDefinition,
+  definitionsMap: Map<string, PageBlockDefinition>,
+  depth: number
+): PageBlockEditorModel[] {
+  const multiRichTextProperty = BlockDefinitionUtils.firstMultiRichTextProperty(definition);
+  if (multiRichTextProperty) {
+    return parseAsMultiRichText(prosemirrorNode, definition, multiRichTextProperty, definitionsMap, depth);
+  }
+
+  const block = shallowProsemirrorNodeAndDefinitionToBlock(prosemirrorNode, definition);
+  return block ? [block] : [];
+}
+
+function shallowProsemirrorNodeAndDefinitionToBlock(
   prosemirrorNode: ProsemirrorNode,
   definition: PageBlockDefinition
 ): PageBlockEditorModel | null {
@@ -210,11 +229,6 @@ export function prosemirrorNodeToBlock(
     return parseAsRichText(prosemirrorNode, definition, richTextProperty);
   }
 
-  const multiRichTextProperty = BlockDefinitionUtils.firstMultiRichTextProperty(definition);
-  if (multiRichTextProperty) {
-    return parseAsMultiRichText(prosemirrorNode, definition, multiRichTextProperty);
-  }
-
   const tableProperty = BlockDefinitionUtils.firstTableProperty(definition);
   if (tableProperty) {
     return parseAsTable(prosemirrorNode, definition, tableProperty);
@@ -294,46 +308,75 @@ function parseCalloutType(prosemirrorCalloutType: unknown): PageBlockCalloutType
 function parseAsMultiRichText(
   prosemirrorNode: ProsemirrorNode,
   definition: PageBlockDefinition,
-  property: PageBlockDefinitionProperty
-): PageBlockEditorModel | null {
+  property: PageBlockDefinitionProperty,
+  definitionsMap: Map<string, PageBlockDefinition>,
+  depth: number
+): PageBlockEditorModel[] {
   const id = getProsemirrorBlockId(prosemirrorNode);
-  if (!id) return null;
+  if (!id) return [];
 
   const variantId = getProsemirrorBlockVariantId(prosemirrorNode);
+  const result: PageBlockEditorModel[] = [];
 
-  return {
-    // TODO Artem: indent
-    id: id,
-    type: "Block",
-    data: {
-      packageId: definition.id,
-      indentLevel: 0,
-
-      ...(variantId && { variantId: variantId }),
+  // Flatten items
+  const listItems: ProsemirrorNode[] = [];
+  prosemirrorNode.content?.forEach(c => {
+    // Illegal child of a list
+    if (c.type !== "listItem") return;
 
-      items: [
-        {
-          id: id,
-          props: {
-            [property.id]: {
-              // Required
-              value: (prosemirrorNode.content ?? [])
-                .map(listItem => {
-                  if (listItem.type !== "listItem") return null;
-                  if (!listItem.content?.length) return parseRichText([]);
-
-                  const paragraph = listItem.content[0];
-                  if (paragraph.type !== "paragraph") return parseRichText([]);
+    c.content?.forEach(cc => {
+      listItems.push(cc);
+    });
+  });
 
+  // Text list items buffering
+  let bufferedTextItems: ProsemirrorNode[] = [];
+  function flushBufferedTextItems() {
+    if (!bufferedTextItems.length) return;
+
+    const idSuffix = result.length ? `-${result.length}` : "";
+
+    result.push({
+      id: id + idSuffix,
+      type: "Block",
+      data: {
+        packageId: definition.id,
+        indentLevel: depth,
+        ...(variantId && { variantId: variantId }),
+        items: [
+          {
+            id: id + idSuffix,
+            props: {
+              [property.id]: {
+                value: bufferedTextItems.map(paragraph => {
                   return parseRichText(paragraph.content ?? []);
-                })
-                .filter(nonNullFilter),
-            } satisfies PageBlockItemMultiRichTextValue,
+                }),
+              } satisfies PageBlockItemMultiRichTextValue,
+            },
           },
-        },
-      ],
-    },
-  };
+        ],
+      },
+    });
+
+    bufferedTextItems = [];
+  }
+
+  listItems.forEach(item => {
+    if (item.type === "paragraph") {
+      bufferedTextItems.push(item);
+      return;
+    }
+
+    // This is not a paragraph, flush text items first
+    flushBufferedTextItems();
+
+    result.push(...internalProsemirrorNodeToBlock(item, definitionsMap, depth + 1));
+  });
+
+  // Flush text items at the end
+  flushBufferedTextItems();
+
+  return result;
 }
 
 //