@supernova-studio/client 0.3.0 → 0.4.1

package/dist/index.mjs

@@ -880,6 +880,7 @@ function traversePageBlocksV1(blocks2, action) {
 var PageBlockLinkType = z33.enum(["DocumentationItem", "PageHeading", "Url"]);
 var PageBlockImageType = z33.enum(["Upload", "Asset", "FigmaFrame"]);
 var PageBlockImageAlignment = z33.enum(["Left", "Center", "Stretch"]);
+var PageBlockTableCellAlignment = z33.enum(["Left", "Center", "Right"]);
 var PageBlockAppearanceV2 = z33.object({
   itemBackgroundColor: ColorValue
 });
@@ -994,9 +995,6 @@ var PageBlockItemStorybookValue = z33.object({
   showAddons: z33.boolean().optional(),
   value: z33.string()
 });
-var PageBlockItemTableValue = z33.object({
-  value: z33.any()
-});
 var PageBlockItemTextValue = z33.object({
   value: z33.string()
 });
@@ -1021,6 +1019,39 @@ var PageBlockItemTokenTypeValue = z33.object({
 var PageBlockItemUrlValue = z33.object({
   value: z33.string()
 });
+var PageBlockItemTableRichTextNode = z33.object({
+  type: z33.literal("RichText"),
+  value: PageBlockItemRichTextValue.shape.value
+});
+var PageBlockItemTableMultiRichTextNode = z33.object({
+  type: z33.literal("MultiRichText"),
+  value: PageBlockItemMultiRichTextValue.shape.value
+});
+var PageBlockItemTableImageNode = z33.object({
+  type: z33.literal("Image"),
+  value: PageBlockItemImageValue.shape.value
+});
+var PageBlockItemTableNode = z33.discriminatedUnion("type", [
+  PageBlockItemTableRichTextNode,
+  PageBlockItemTableMultiRichTextNode,
+  PageBlockItemTableImageNode
+]);
+var PageBlockItemTableCell = z33.object({
+  id: z33.string(),
+  nodes: z33.array(PageBlockItemTableNode),
+  columnWidth: z33.number().optional(),
+  alignment: PageBlockTableCellAlignment
+});
+var PageBlockItemTableRow = z33.object({
+  cells: z33.array(PageBlockItemTableCell)
+});
+var PageBlockItemTableValue = z33.object({
+  highlightHeaderColumn: z33.boolean().optional(),
+  highlightHeaderRow: z33.boolean().optional(),
+  showBorder: z33.boolean().optional(),
+  width: z33.number().optional(),
+  value: z33.array(PageBlockItemTableRow)
+});
 var DocumentationItemConfiguration = z34.object({
   showSidebar: z34.boolean(),
   header: z34.any()
@@ -3782,6 +3813,11 @@ var BlockParsingUtils = {
     const richText = PageBlockItemMultiRichTextValue.parse(objectValue);
     return richText;
   },
+  tablePropertyValue(item, propertyKey) {
+    const objectValue = this.objectPropertyValue(item, propertyKey);
+    const table = PageBlockItemTableValue.parse(objectValue);
+    return table;
+  },
   embedPropertyValue(item, propertyKey) {
     const objectValue = this.objectPropertyValue(item, propertyKey);
     const embed = PageBlockItemEmbedValue.parse(objectValue);
@@ -3815,7 +3851,7 @@ var BlockDefinitionUtils = {
     return void 0;
   },
   firstTableProperty(definition) {
-    const property = definition.item.properties.find((p) => p.type === "RichText");
+    const property = definition.item.properties.find((p) => p.type === "Table");
     if (property)
       return property;
     return void 0;
@@ -3881,6 +3917,14 @@ function blockToProsemirrorNode(block, definition) {
       property: multiRichTextProperty
     });
   }
+  const tableProperty = BlockDefinitionUtils.firstTableProperty(definition);
+  if (tableProperty) {
+    return serializeAsTable({
+      block,
+      definition,
+      property: tableProperty
+    });
+  }
   const embedProperty = BlockDefinitionUtils.firstEmbedProperty(definition);
   const embedType = serializeEmbedType(block.data.packageId);
   if (embedProperty && embedType) {
@@ -3926,7 +3970,7 @@ function serializeAsParagraph(input) {
   return {
     type: "paragraph",
     attrs: serializeBlockNodeAttributes(input),
-    content: serializeRichText(input.richTextPropertyValue.value)
+    ...serializeRichTextNodePart(input.richTextPropertyValue.value)
   };
 }
 function serializeAsHeading(input) {
@@ -3936,14 +3980,14 @@ function serializeAsHeading(input) {
       ...serializeBlockNodeAttributes(input),
       level: richTextHeadingLevel(input.property)
     },
-    content: serializeRichText(input.richTextPropertyValue.value)
+    ...serializeRichTextNodePart(input.richTextPropertyValue.value)
   };
 }
 function serializeAsBlockquote(input) {
   return {
     type: "blockquote",
     attrs: serializeBlockNodeAttributes(input),
-    content: serializeRichText(input.richTextPropertyValue.value)
+    ...serializeRichTextNodePart(input.richTextPropertyValue.value)
   };
 }
 function serializeAsCallout(input) {
@@ -3954,7 +3998,7 @@ function serializeAsCallout(input) {
       ...serializeBlockNodeAttributes(input),
       type: serializeCalloutType(calloutType)
     },
-    content: serializeRichText(input.richTextPropertyValue.value)
+    ...serializeRichTextNodePart(input.richTextPropertyValue.value)
   };
 }
 function serializeAsMultiRichTextBlock(input) {
@@ -4011,6 +4055,75 @@ function serializeAsListItem(text) {
     ]
   };
 }
+function serializeAsTable(input) {
+  const { block, definition, property: tableProperty } = input;
+  const blockItem = BlockParsingUtils.singleBlockItem(block);
+  const table = BlockParsingUtils.tablePropertyValue(blockItem, tableProperty.id);
+  return {
+    type: "tableContainer",
+    attrs: {
+      ...serializeBlockNodeAttributes(input),
+      hasBorder: table.showBorder ?? true
+    },
+    content: [
+      {
+        type: "table",
+        content: table.value.map((row, rowIndex) => {
+          const isHeaderRow = rowIndex === 0 && table.highlightHeaderRow === true;
+          return {
+            type: "tableRow",
+            content: row.cells.map((cell, cellIndex) => {
+              const isHeaderColumn = cellIndex === 0 && table.highlightHeaderColumn === true;
+              return {
+                type: isHeaderRow || isHeaderColumn ? "tableHeader" : "tableCell",
+                attrs: {
+                  id: cell.id,
+                  textAlign: serializeTableCellAlignment(cell.alignment),
+                  colspan: 1,
+                  rowspan: 1,
+                  ...cell.columnWidth && { colwidth: [cell.columnWidth] }
+                },
+                content: cell.nodes.map(serializeTableNode)
+              };
+            })
+          };
+        })
+      }
+    ]
+  };
+}
+function serializeTableCellAlignment(alignment) {
+  switch (alignment) {
+    case "Left":
+      return "left";
+    case "Center":
+      return "center";
+    case "Right":
+      return "right";
+    default:
+      return "left";
+  }
+}
+function serializeTableNode(node) {
+  switch (node.type) {
+    case "RichText":
+      return {
+        type: "paragraph",
+        ...serializeRichTextNodePart(node.value)
+      };
+    case "Image":
+      return {
+        type: "image",
+        attrs: {
+          src: node.value?.url
+        }
+      };
+    case "MultiRichText":
+      return {
+        type: "paragraph"
+      };
+  }
+}
 function serializeAsEmbed(input, embedType) {
   const { block, definition, property: embedProperty } = input;
   const blockItem = BlockParsingUtils.singleBlockItem(block);
@@ -4084,6 +4197,12 @@ function serializeCalloutType(calloutType) {
       return "warning";
   }
 }
+function serializeRichTextNodePart(richText) {
+  const spans = serializeRichText(richText);
+  if (spans.length)
+    return { content: spans };
+  return {};
+}
 function serializeRichText(richText) {
   return richText.spans.map(serializeTextSpan).flat();
 }
@@ -4094,7 +4213,7 @@ function serializeTextSpan(span) {
     {
       type: "text",
       text: textParts[0],
-      marks
+      ...marks.length && { marks }
     }
   ];
   for (let i = 1; i < textParts.length; i++) {
@@ -4105,7 +4224,7 @@ function serializeTextSpan(span) {
       {
         type: "text",
         text: textParts[i],
-        marks
+        ...marks.length && { marks }
       }
     );
   }
@@ -5555,6 +5674,10 @@ function prosemirrorNodeToBlock(prosemirrorNode, definition) {
   if (prosemirrorNode.type === "embed" && embedProperty) {
     return parseAsEmbed(prosemirrorNode, definition, embedProperty);
   }
+  const tableProperty = BlockDefinitionUtils.firstTableProperty(definition);
+  if (tableProperty) {
+    return parseAsTable(prosemirrorNode, definition, tableProperty);
+  }
   if (definition.id === "io.supernova.block.divider") {
     return parseAsDivider(prosemirrorNode, definition);
   }
@@ -5670,6 +5793,146 @@ function parseRichTextAttribute(mark) {
   }
   return null;
 }
+function parseAsTable(prosemirrorNode, definition, property) {
+  const id = parseProsemirrorBlockAttribute(prosemirrorNode, "id");
+  const variantId = parseProsemirrorOptionalBlockAttribute(prosemirrorNode, "variantId");
+  const hasBorder = parseProsemirrorOptionalBlockAttribute(prosemirrorNode, "hasBorder") !== false;
+  const tableChild = prosemirrorNode.content?.find((c) => c.type === "table");
+  if (!tableChild) {
+    return emptyTable(id, variantId, 0);
+  }
+  const rows = tableChild.content?.filter((c) => c.type === "tableRow" && !!c.content?.length) ?? [];
+  if (!rows.length) {
+    return emptyTable(id, variantId, 0);
+  }
+  const rowHeaderCells = rows[0].content?.filter((c) => c.type === "tableHeader").length ?? 0;
+  const columnHeaderCells = rows.filter((r) => r.content?.[0]?.type === "tableHeader").length;
+  const hasHeaderRow = rows[0].content?.length === rowHeaderCells;
+  const hasHeaderColumn = rows.length === columnHeaderCells;
+  const tableValue = {
+    showBorder: hasBorder,
+    highlightHeaderRow: hasHeaderRow,
+    highlightHeaderColumn: hasHeaderColumn,
+    value: []
+  };
+  tableValue.value = rows.map((row) => {
+    return {
+      cells: (row.content ?? []).map(parseAsTableCell)
+    };
+  });
+  return {
+    id,
+    data: {
+      packageId: "io.supernova.block.table",
+      indentLevel: 0,
+      ...variantId && { variantId },
+      items: [
+        {
+          id,
+          props: {
+            table: tableValue
+          }
+        }
+      ]
+    }
+  };
+}
+function parseAsTableCell(prosemirrorNode) {
+  const id = parseProsemirrorBlockAttribute(prosemirrorNode, "id");
+  const textAlign = parseProsemirrorOptionalBlockAttribute(prosemirrorNode, "textAlign");
+  let columnWidth;
+  const columnWidthArray = parseProsemirrorOptionalBlockAttribute(prosemirrorNode, "colwidth");
+  if (Array.isArray(columnWidthArray) && typeof columnWidthArray[0] === "number") {
+    columnWidth = columnWidthArray[0];
+  }
+  const tableNodes = (prosemirrorNode.content ?? []).map(parseAsTableNode).filter(nonNullFilter2);
+  return {
+    id,
+    alignment: parseTableCellAlignment(textAlign),
+    ...columnWidth && { columnWidth },
+    nodes: tableNodes.length ? tableNodes : emptyTableCellContent()
+  };
+}
+function parseTableCellAlignment(alignment) {
+  if (!alignment)
+    return "Left";
+  switch (alignment) {
+    case "left":
+      return "Left";
+    case "center":
+      return "Center";
+    case "right":
+      return "Right";
+    default:
+      return "Left";
+  }
+}
+function parseAsTableNode(prosemirrorNode) {
+  switch (prosemirrorNode.type) {
+    case "paragraph":
+      return {
+        type: "RichText",
+        value: parseRichText(prosemirrorNode.content ?? [])
+      };
+    case "image":
+      const url = parseProsemirrorOptionalBlockAttribute(prosemirrorNode, "src");
+      if (!url || typeof url !== "string")
+        return null;
+      return {
+        type: "Image",
+        value: {
+          type: "Upload",
+          url
+        }
+      };
+    default:
+      return null;
+  }
+}
+function emptyTable(id, variantId, indentLevel) {
+  const tableValue = {
+    showBorder: true,
+    highlightHeaderColumn: false,
+    highlightHeaderRow: false,
+    value: []
+  };
+  for (let i = 0; i < 2; i++) {
+    tableValue.value.push({
+      cells: []
+    });
+    for (let j = 0; j < 3; j++) {
+      tableValue.value[i].cells.push({
+        id: "",
+        alignment: "Left",
+        nodes: emptyTableCellContent()
+      });
+    }
+  }
+  return {
+    id,
+    data: {
+      packageId: "io.supernova.block.table",
+      indentLevel: indentLevel ?? 0,
+      variantId,
+      items: [
+        {
+          id,
+          props: {
+            table: tableValue
+          }
+        }
+      ]
+    }
+  };
+}
+function emptyTableCellContent() {
+  return [
+    {
+      type: "RichText",
+      value: { spans: [] }
+    }
+  ];
+}
 function parseAsEmbed(prosemirrorNode, definition, property) {
   const id = parseProsemirrorBlockAttribute(prosemirrorNode, "id");
   const variantId = parseProsemirrorOptionalBlockAttribute(prosemirrorNode, "variantId");
@@ -5745,6 +6008,8 @@ function parseItem(rawItem, definition) {
     const validationResult = valueSchema.safeParse(value);
     if (validationResult.success) {
       sanitizedProps[property.id] = validationResult.data;
+    } else {
+      console.log(validationResult.error.flatten());
     }
   }
   return {
@@ -5808,7 +6073,7 @@ function valueSchemaForPropertyType(type) {
 function parseProsemirrorBlockAttribute(prosemirrorNode, attributeName) {
   const attributeValue = parseProsemirrorOptionalBlockAttribute(prosemirrorNode, attributeName);
   if (!attributeValue) {
-    throw new Error(`Attribute ${attributeName} was not defined`);
+    throw new Error(`Attribute ${attributeName} was not defined on node ${prosemirrorNode.type}`);
   }
   return attributeValue;
 }
@@ -6109,6 +6374,12 @@ export {
   PageBlockItemSandboxValue,
   PageBlockItemSingleSelectValue,
   PageBlockItemStorybookValue,
+  PageBlockItemTableCell,
+  PageBlockItemTableImageNode,
+  PageBlockItemTableMultiRichTextNode,
+  PageBlockItemTableNode,
+  PageBlockItemTableRichTextNode,
+  PageBlockItemTableRow,
   PageBlockItemTableValue,
   PageBlockItemTextValue,
   PageBlockItemTokenPropertyValue,
@@ -6122,6 +6393,7 @@ export {
   PageBlockLinkV2,
   PageBlockRenderCodeProperties,
   PageBlockShortcut,
+  PageBlockTableCellAlignment,
   PageBlockTableColumn,
   PageBlockTableProperties,
   PageBlockText,