@supernova-studio/client 0.26.0 → 0.28.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@supernova-studio/client",
-  "version": "0.26.0",
+  "version": "0.28.0",
   "description": "Supernova Data Models",
   "source": "src/index.ts",
   "main": "dist/index.js",

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

@@ -624,6 +624,7 @@ export function serializeAsCustomBlock(block: PageBlockEditorModel, definition:
       ...(block.data.variantId && { variantId: block.data.variantId }),
       items: JSON.stringify(items),
 
+      ...(block.data.appearance && { appearance: JSON.stringify(block.data.appearance) }),
       ...(columns && { columns: columns }),
     },
   };

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

@@ -38,11 +38,9 @@ import {
   PageBlockItemTableCell,
   PageBlockTableCellAlignment,
   PageBlockAppearanceV2,
-  ColorValue,
   nullishToOptional,
   PageBlockItemFigmaNodeValue,
   PageBlockColorV2,
-  SupernovaException,
   PageSectionItemV2,
   PageSectionColumnV2,
 } from "@supernova-studio/model";
@@ -50,8 +48,7 @@ import { PageBlockEditorModel, PageSectionEditorModel } from "./model/block";
 import { DocumentationPageEditorModel } from "./model/page";
 import { BlockDefinitionUtils } from "./utils";
 import { yXmlFragmentToProsemirrorJSON } from "y-prosemirror";
-import { ZodAnyDef, ZodSchema, ZodTypeDef, z } from "zod";
-import { o } from "vitest/dist/types-198fd1d9";
+import { ZodSchema, ZodTypeDef, z } from "zod";
 
 export function yDocToPage(yDoc: Y.Doc, definitions: PageBlockDefinition[]): DocumentationPageEditorModel {
   return yXmlFragmentToPage(yDoc.getXmlFragment("default"), definitions);
@@ -72,7 +69,7 @@ export function prosemirrorDocToPage(
   const definitionsById = mapByUnique(definitions, d => d.id);
 
   return {
-    blocks: internalProsemirrorNodesToBlocks(prosemirrorDoc.content ?? [], definitionsById),
+    blocks: internalProsemirrorNodesToPageItems(prosemirrorDoc.content ?? [], definitionsById),
   };
 }
 
@@ -150,31 +147,53 @@ export function prosemirrorNodesToBlocks(prosemirrorNodes: ProsemirrorNode[], de
   return internalProsemirrorNodesToBlocks(prosemirrorNodes, definitionsById);
 }
 
+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);
+}
+
 function internalProsemirrorNodesToBlocks(
   prosemirrorNodes: ProsemirrorNode[],
   definitionsMap: Map<string, PageBlockDefinition>
 ): PageBlockEditorModel[] {
   return prosemirrorNodes
     .map(prosemirrorNode => {
-      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 internalProsemirrorNodeToBlock(prosemirrorNode, definitionsMap);
+    })
+    .filter(nonNullFilter);
+}
 
-        return null;
-      }
+function internalProsemirrorNodeToBlock(
+  prosemirrorNode: ProsemirrorNode,
+  definitionsMap: Map<string, PageBlockDefinition>
+) {
+  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`);
 
-      const definition = definitionsMap.get(definitionId);
-      if (!definition) {
-        console.warn(
-          `Block definitionId "${definitionId}" (prosemirror node ${prosemirrorNode.type}) is not among available definitions`
-        );
-        console.warn(prosemirrorNode);
-        return null;
-      }
+    return null;
+  }
 
-      return prosemirrorNodeToBlock(prosemirrorNode, definition);
-    })
-    .filter(nonNullFilter);
+  const definition = definitionsMap.get(definitionId);
+  if (!definition) {
+    console.warn(
+      `Block definitionId "${definitionId}" (prosemirror node ${prosemirrorNode.type}) is not among available definitions`
+    );
+    console.warn(prosemirrorNode);
+    return null;
+  }
+
+  return prosemirrorNodeToBlock(prosemirrorNode, definition);
 }
 
 export function prosemirrorNodeToBlock(
@@ -623,7 +642,15 @@ function parseBlockItems(prosemirrorNode: ProsemirrorNode, definition: PageBlock
 }
 
 function parseAppearance(prosemirrorNode: ProsemirrorNode): PageBlockAppearanceV2 | undefined {
-  const appearance: PageBlockAppearanceV2 = {};
+  let appearance: PageBlockAppearanceV2 = {};
+
+  const rawAppearanceString = getProsemirrorAttribute(prosemirrorNode, "appearance", z.string().optional());
+  if (rawAppearanceString) {
+    const parsedAppearance = PageBlockAppearanceV2.safeParse(JSON.parse(rawAppearanceString));
+    if (parsedAppearance.success) {
+      appearance = parsedAppearance.data;
+    }
+  }
 
   const columns = getProsemirrorAttribute(prosemirrorNode, "columns", z.number().optional());
   if (columns) {