@supernova-studio/client 1.96.6 → 1.96.7

package/src/yjs/docs-editor/mock.ts

@@ -0,0 +1,2271 @@
+import { PageBlockDefinition } from "@supernova-studio/model";
+
+export function getMockPageBlockDefinitions(): PageBlockDefinition[] {
+  return blocks.map(block => {
+    return {
+      ...block,
+      item: {
+        ...block.item,
+
+        // Make sure variatns array is copied
+        variants: [...block.item.variants],
+      },
+    };
+  });
+}
+
+const blocks: PageBlockDefinition[] = [
+  {
+    id: "io.supernova.block.rich-text",
+    name: "Text",
+    description: "Plain text",
+    category: "Text",
+    icon: "https://cdn-assets.supernova.io/blocks/icons/v3/text.svg",
+    searchKeywords: ["paragraph", "rich text"],
+    item: {
+      properties: [
+        {
+          id: "text",
+          name: "Text",
+          type: "RichText",
+          options: {
+            richTextStyle: "Default",
+          },
+        },
+      ],
+      appearance: {
+        isBordered: true,
+        hasBackground: false,
+      },
+      variants: [
+        {
+          id: "default",
+          name: "Default",
+          layout: {
+            type: "Column",
+            children: ["text"],
+            columnAlign: "Start",
+            columnResizing: "Fill",
+            gap: "Medium",
+          },
+          maxColumns: 1,
+          defaultColumns: 1,
+          appearance: {
+            isEditorPresentationDifferent: false,
+          },
+        },
+      ],
+      defaultVariantKey: "default",
+    },
+    behavior: {
+      dataType: "Item",
+      items: {
+        numberOfItems: 1,
+        allowLinks: false,
+      },
+    },
+    editorOptions: {
+      onboarding: {
+        helpText: "Use rich text block to write text and add additional formatting to it.",
+        documentationLink: "https://learn.supernova.io/latest/documentation/types-of-blocks/text/text-HxZ9ssJR",
+      },
+    },
+    appearance: {
+      isBordered: true,
+      hasBackground: false,
+      isEditorPresentationDifferent: false,
+      showBlockHeaderInEditor: false,
+    },
+  },
+  {
+    id: "io.supernova.block.title1",
+    name: "Heading 1",
+    description: "Main sections within the page",
+    category: "Text",
+    icon: "https://cdn-assets.supernova.io/blocks/icons/v2/title-1.svg",
+    searchKeywords: ["title", "h1"],
+    item: {
+      properties: [
+        {
+          id: "text",
+          name: "Text",
+          type: "RichText",
+          options: {
+            placeholder: "Heading 1",
+            richTextStyle: "Title1",
+          },
+        },
+      ],
+      appearance: {
+        isBordered: true,
+        hasBackground: false,
+      },
+      variants: [
+        {
+          id: "default",
+          name: "Default",
+          layout: {
+            type: "Column",
+            children: ["text"],
+            columnAlign: "Start",
+            columnResizing: "Fill",
+            gap: "Medium",
+          },
+          maxColumns: 1,
+          defaultColumns: 1,
+          appearance: {},
+        },
+      ],
+      defaultVariantKey: "default",
+    },
+    behavior: {
+      dataType: "Item",
+      items: {
+        numberOfItems: 1,
+        allowLinks: false,
+      },
+    },
+    editorOptions: {
+      onboarding: {
+        helpText: "Use for main sections within the page, introducing broad topics or themes.",
+        documentationLink: "https://learn.supernova.io/latest/documentation/types-of-blocks/text/heading-MUKlJ7dY",
+      },
+    },
+    appearance: {
+      isBordered: true,
+      hasBackground: false,
+      isEditorPresentationDifferent: false,
+      showBlockHeaderInEditor: false,
+    },
+  },
+  {
+    id: "io.supernova.block.title2",
+    name: "Heading 2",
+    description: "Section subheadings",
+    category: "Text",
+    icon: "https://cdn-assets.supernova.io/blocks/icons/v2/title-2.svg",
+    searchKeywords: ["title", "h2"],
+    item: {
+      properties: [
+        {
+          id: "text",
+          name: "Text",
+          type: "RichText",
+          options: {
+            placeholder: "Heading 2",
+            richTextStyle: "Title2",
+          },
+        },
+      ],
+      appearance: {
+        isBordered: true,
+        hasBackground: false,
+      },
+      variants: [
+        {
+          id: "default",
+          name: "Default",
+          layout: {
+            type: "Column",
+            children: ["text"],
+            columnAlign: "Start",
+            columnResizing: "Fill",
+            gap: "Medium",
+          },
+          maxColumns: 1,
+          defaultColumns: 1,
+          appearance: {},
+        },
+      ],
+      defaultVariantKey: "default",
+    },
+    behavior: {
+      dataType: "Item",
+      items: {
+        numberOfItems: 1,
+        allowLinks: false,
+      },
+    },
+    editorOptions: {
+      onboarding: {
+        helpText: "Use for subheadings, indicating major subsections under the main sections.",
+        documentationLink: "https://learn.supernova.io/latest/documentation/types-of-blocks/text/heading-MUKlJ7dY",
+      },
+    },
+    appearance: {
+      isBordered: true,
+      hasBackground: false,
+      isEditorPresentationDifferent: false,
+      showBlockHeaderInEditor: false,
+    },
+  },
+  {
+    id: "io.supernova.block.title3",
+    name: "Heading 3",
+    description: "Further subsections",
+    category: "Text",
+    icon: "https://cdn-assets.supernova.io/blocks/icons/v2/title-3.svg",
+    searchKeywords: ["title", "h3"],
+    item: {
+      properties: [
+        {
+          id: "text",
+          name: "Text",
+          type: "RichText",
+          options: {
+            placeholder: "Heading 3",
+            richTextStyle: "Title3",
+          },
+        },
+      ],
+      appearance: {
+        isBordered: true,
+        hasBackground: false,
+      },
+      variants: [
+        {
+          id: "default",
+          name: "Default",
+          layout: {
+            type: "Column",
+            children: ["text"],
+            columnAlign: "Start",
+            columnResizing: "Fill",
+            gap: "Medium",
+          },
+          maxColumns: 1,
+          defaultColumns: 1,
+          appearance: {},
+        },
+      ],
+      defaultVariantKey: "default",
+    },
+    behavior: {
+      dataType: "Item",
+      items: {
+        numberOfItems: 1,
+        allowLinks: false,
+      },
+    },
+    editorOptions: {
+      onboarding: {
+        helpText: "Use for further subsections, detailing specific topics within the major subsections.",
+        documentationLink: "https://learn.supernova.io/latest/documentation/types-of-blocks/text/heading-MUKlJ7dY",
+      },
+    },
+    appearance: {
+      isBordered: true,
+      hasBackground: false,
+      isEditorPresentationDifferent: false,
+      showBlockHeaderInEditor: false,
+    },
+  },
+  {
+    id: "io.supernova.block.title4",
+    name: "Heading 4",
+    description: "Details in subsections",
+    category: "Text",
+    icon: "https://cdn-assets.supernova.io/blocks/icons/v2/title-4.svg",
+    searchKeywords: ["title", "h4"],
+    item: {
+      properties: [
+        {
+          id: "text",
+          name: "Text",
+          type: "RichText",
+          options: {
+            placeholder: "Heading 4",
+            richTextStyle: "Title4",
+          },
+        },
+      ],
+      appearance: {
+        isBordered: true,
+        hasBackground: false,
+      },
+      variants: [
+        {
+          id: "default",
+          name: "Default",
+          layout: {
+            type: "Column",
+            children: ["text"],
+            columnAlign: "Start",
+            columnResizing: "Fill",
+            gap: "Medium",
+          },
+          maxColumns: 1,
+          defaultColumns: 1,
+          appearance: {},
+        },
+      ],
+      defaultVariantKey: "default",
+    },
+    behavior: {
+      dataType: "Item",
+      items: { numberOfItems: 1, allowLinks: false },
+    },
+    editorOptions: {
+      onboarding: {
+        helpText: "Use for sub-divisions, elaborating on details within the subsections.",
+        documentationLink: "https://learn.supernova.io/latest/documentation/types-of-blocks/text/heading-MUKlJ7dY",
+      },
+    },
+    appearance: {
+      isBordered: true,
+      hasBackground: false,
+      isEditorPresentationDifferent: false,
+      showBlockHeaderInEditor: false,
+    },
+  },
+  {
+    id: "io.supernova.block.title5",
+    name: "Heading 5",
+    description: "Nuanced details or sub-points",
+    category: "Text",
+    icon: "https://cdn-assets.supernova.io/blocks/icons/v2/title-5.svg",
+    searchKeywords: ["title", "h5"],
+    item: {
+      properties: [
+        {
+          id: "text",
+          name: "Text",
+          type: "RichText",
+          options: {
+            placeholder: "Heading 5",
+            richTextStyle: "Title5",
+          },
+        },
+      ],
+      appearance: {
+        isBordered: true,
+        hasBackground: false,
+      },
+      variants: [
+        {
+          id: "default",
+          name: "Default",
+          layout: {
+            type: "Column",
+            children: ["text"],
+            columnAlign: "Start",
+            columnResizing: "Fill",
+            gap: "Medium",
+          },
+          maxColumns: 1,
+          defaultColumns: 1,
+          appearance: {},
+        },
+      ],
+      defaultVariantKey: "default",
+    },
+    behavior: {
+      dataType: "Item",
+      items: { numberOfItems: 1, allowLinks: false },
+    },
+    editorOptions: {
+      onboarding: {
+        helpText: "Use for nuanced details or specific sub-points within sub-divisions.",
+        documentationLink: "https://learn.supernova.io/latest/documentation/types-of-blocks/text/heading-MUKlJ7dY",
+      },
+    },
+    appearance: {
+      isBordered: true,
+      hasBackground: false,
+      isEditorPresentationDifferent: false,
+      showBlockHeaderInEditor: false,
+    },
+  },
+  {
+    id: "io.supernova.block.ordered-list",
+    name: "Numbered list",
+    description: "An ordered list with numbers",
+    category: "Text",
+    icon: "https://cdn-assets.supernova.io/blocks/icons/list-ordered.svg",
+    searchKeywords: ["ol", "ordered"],
+    item: {
+      properties: [
+        {
+          id: "text",
+          name: "Text",
+          type: "MultiRichText",
+          options: { multiRichTextStyle: "OL" },
+        },
+      ],
+      appearance: { isBordered: true, hasBackground: false },
+      variants: [
+        {
+          id: "default",
+          name: "Default",
+          layout: {
+            type: "Column",
+            children: ["text"],
+            columnAlign: "Start",
+            columnResizing: "Fill",
+            gap: "Medium",
+          },
+          maxColumns: 1,
+          defaultColumns: 1,
+          appearance: {},
+        },
+      ],
+      defaultVariantKey: "default",
+    },
+    behavior: { dataType: "Item", items: { numberOfItems: 1, allowLinks: false } },
+    editorOptions: {
+      onboarding: {
+        helpText: "Display a sequence of numbers or letters to indicate order.",
+        documentationLink: "https://learn.supernova.io/latest/documentation/types-of-blocks/text/list-UC5iPZLK",
+      },
+    },
+    appearance: {
+      isBordered: true,
+      hasBackground: false,
+      isEditorPresentationDifferent: false,
+      showBlockHeaderInEditor: false,
+    },
+  },
+  {
+    id: "io.supernova.block.unordered-list",
+    name: "Bulleted list",
+    description: "A list with bullet points",
+    category: "Text",
+    icon: "https://cdn-assets.supernova.io/blocks/icons/list-unordered.svg",
+    searchKeywords: ["ul", "bullet points"],
+    item: {
+      properties: [
+        {
+          id: "text",
+          name: "Text",
+          type: "MultiRichText",
+          options: { multiRichTextStyle: "UL" },
+        },
+      ],
+      appearance: { isBordered: true, hasBackground: false },
+      variants: [
+        {
+          id: "default",
+          name: "Default",
+          layout: {
+            type: "Column",
+            children: ["text"],
+            columnAlign: "Start",
+            columnResizing: "Fill",
+            gap: "Medium",
+          },
+          maxColumns: 1,
+          defaultColumns: 1,
+          appearance: {},
+        },
+      ],
+      defaultVariantKey: "default",
+    },
+    behavior: { dataType: "Item", items: { numberOfItems: 1, allowLinks: false } },
+    editorOptions: {
+      onboarding: {
+        helpText: "A list of items displayed with bullet points without a specific sequence.",
+        documentationLink: "https://learn.supernova.io/latest/documentation/types-of-blocks/text/list-UC5iPZLK",
+      },
+    },
+    appearance: {
+      isBordered: true,
+      hasBackground: false,
+      isEditorPresentationDifferent: false,
+      showBlockHeaderInEditor: false,
+    },
+  },
+  {
+    id: "io.supernova.block.do-dont-guidelines",
+    name: "Guidelines",
+    description: "Document your Do's and Don'ts.",
+    category: "Guidelines",
+    icon: "https://cdn-assets.supernova.io/blocks/icons/guidelines.svg",
+    searchKeywords: ["do", "dont", "caution", "rules"],
+    item: {
+      properties: [
+        {
+          id: "block.do-dont-guidelines.property.image",
+          name: "Image",
+          type: "Image",
+          options: { allowCaption: true },
+        },
+        {
+          id: "block.do-dont-guidelines.property.type",
+          name: "Type",
+          type: "SingleSelect",
+          options: {
+            defaultChoice: "do",
+            choices: [
+              { value: "do", name: "Do", color: "Green", icon: "CheckCircle" },
+              { value: "dont", name: "Don't", color: "Red", icon: "CrossCircle" },
+              { value: "caution", name: "Caution", color: "Orange", icon: "Alert" },
+            ],
+            singleSelectStyle: "ToggleButton",
+          },
+        },
+        {
+          id: "block.do-dont-guidelines.property.description",
+          name: "Description",
+          type: "RichTextEditor",
+          options: {
+            allowedInlineStyles: ["Bold", "Italic", "Strikethrough", "UL", "OL", "Link", "InlineCode"],
+            placeholder: "Add description",
+          },
+        },
+      ],
+      appearance: { isBordered: true, hasBackground: false },
+      variants: [
+        {
+          id: "simple",
+          name: "Simple",
+          image: "https://cdn-assets.supernova.io/blocks/variants/guidelines-simple.svg",
+          description: "With a minimalist badge at the top, this design is great for content guidelines.",
+          layout: {
+            type: "Column",
+            children: [
+              "block.do-dont-guidelines.property.type",
+              "block.do-dont-guidelines.property.image",
+              "block.do-dont-guidelines.property.description",
+            ],
+            columnAlign: "Start",
+            columnResizing: "Fill",
+            gap: "Medium",
+          },
+          maxColumns: 3,
+          defaultColumns: 2,
+          appearance: {},
+        },
+        {
+          id: "prominent",
+          name: "Prominent",
+          image: "https://cdn-assets.supernova.io/blocks/variants/guidelines-prominent.svg",
+          description: "Recommended when you need guidelines that need to stand out.",
+          layout: {
+            type: "Column",
+            children: [
+              "block.do-dont-guidelines.property.type",
+              "block.do-dont-guidelines.property.image",
+              "block.do-dont-guidelines.property.description",
+            ],
+            columnAlign: "Start",
+            columnResizing: "Fill",
+            gap: "Medium",
+          },
+          maxColumns: 3,
+          defaultColumns: 1,
+          appearance: { isEditorPresentationDifferent: true },
+        },
+        {
+          id: "contained",
+          name: "Contained",
+          image: "https://cdn-assets.supernova.io/blocks/variants/guidelines-contained.svg",
+          description: "Perfect for component guidelines with spacious images.",
+          layout: {
+            type: "Column",
+            children: [
+              "block.do-dont-guidelines.property.type",
+              "block.do-dont-guidelines.property.image",
+              "block.do-dont-guidelines.property.description",
+            ],
+            columnAlign: "Start",
+            columnResizing: "Fill",
+            gap: "Medium",
+          },
+          maxColumns: 3,
+          defaultColumns: 1,
+          appearance: { isEditorPresentationDifferent: true },
+        },
+        {
+          id: "side-border",
+          name: "Side border",
+          image: "https://cdn-assets.supernova.io/blocks/variants/guidelines-side-border.svg",
+          description: "The side border makes this variant well-suited for longer text guidelines.",
+          layout: {
+            type: "Column",
+            children: [
+              "block.do-dont-guidelines.property.type",
+              "block.do-dont-guidelines.property.image",
+              "block.do-dont-guidelines.property.description",
+            ],
+            columnAlign: "Start",
+            columnResizing: "Fill",
+            gap: "Medium",
+          },
+          maxColumns: 3,
+          defaultColumns: 1,
+          appearance: { isEditorPresentationDifferent: true },
+        },
+      ],
+      defaultVariantKey: "simple",
+    },
+    behavior: {
+      dataType: "Item",
+      items: { numberOfItems: -1, allowLinks: false, newItemLabel: "Add guideline" },
+    },
+    editorOptions: {
+      onboarding: {
+        helpText: "Use link block to document your Do/Don't guidelines for your components and patterns.",
+        documentationLink:
+          "https://learn.supernova.io/latest/documentation/types-of-blocks/links/shortcuts/general-jVfNifo4",
+      },
+      newItemLabel: "Add guideline",
+    },
+    appearance: {
+      isBordered: true,
+      hasBackground: false,
+      isEditorPresentationDifferent: false,
+      showBlockHeaderInEditor: false,
+    },
+  },
+  {
+    id: "io.supernova.block.divider",
+    name: "Divider",
+    description: "A section divider",
+    category: "Layout",
+    icon: "https://cdn-assets.supernova.io/blocks/icons/divider.svg",
+    searchKeywords: ["hr", "line", "rule", "separator"],
+    item: {
+      properties: [{ id: "divider", name: "Divider", type: "Divider", options: {} }],
+      appearance: { isBordered: true, hasBackground: false },
+      variants: [
+        {
+          id: "default",
+          name: "Default",
+          layout: {
+            type: "Column",
+            children: ["divider"],
+            columnAlign: "Start",
+            columnResizing: "Fill",
+            gap: "Medium",
+          },
+          maxColumns: 1,
+          defaultColumns: 1,
+          appearance: {},
+        },
+      ],
+      defaultVariantKey: "default",
+    },
+    behavior: { dataType: "Item", items: { numberOfItems: 1, allowLinks: false } },
+    editorOptions: {
+      onboarding: {
+        helpText: "A thematic break or horizontal rule, often used to separate content or define a change in topic.",
+        documentationLink: "https://learn.supernova.io/latest/documentation/types-of-blocks/text/divider-tLuxooLH",
+      },
+    },
+    appearance: {
+      isBordered: true,
+      hasBackground: false,
+      isEditorPresentationDifferent: false,
+      showBlockHeaderInEditor: false,
+    },
+  },
+  {
+    id: "io.supernova.block.blockquote",
+    name: "Quote",
+    description: "Display a quotation",
+    category: "Text",
+    icon: "https://cdn-assets.supernova.io/blocks/icons/blockquote.svg",
+    searchKeywords: ["cite", "blockquote"],
+    item: {
+      properties: [
+        {
+          id: "text",
+          name: "Text",
+          type: "RichText",
+          options: { placeholder: "Write a quote...", richTextStyle: "Quote" },
+        },
+      ],
+      appearance: { isBordered: true, hasBackground: false },
+      variants: [
+        {
+          id: "default",
+          name: "Default",
+          layout: { type: "Column", children: ["text"], columnAlign: "Start", columnResizing: "Fill", gap: "Medium" },
+          maxColumns: 1,
+          defaultColumns: 1,
+          appearance: {},
+        },
+      ],
+      defaultVariantKey: "default",
+    },
+    behavior: { dataType: "Item", items: { numberOfItems: 1, allowLinks: false } },
+    editorOptions: {
+      onboarding: {
+        helpText: "Use a blockquote to set off a quotation or cited content from the main text.",
+        documentationLink: "https://learn.supernova.io/latest/documentation/types-of-blocks/text/blockquote-zYWAsb6X",
+      },
+    },
+    appearance: {
+      isBordered: true,
+      hasBackground: false,
+      isEditorPresentationDifferent: false,
+      showBlockHeaderInEditor: false,
+    },
+  },
+  {
+    id: "io.supernova.block.callout",
+    name: "Callout",
+    description: "Highlight a section of text",
+    category: "Text",
+    icon: "https://cdn-assets.supernova.io/blocks/icons/v3/callout.svg",
+    searchKeywords: ["banner", "alert", "note", "tip", "warning"],
+    item: {
+      properties: [
+        {
+          id: "text",
+          name: "Text",
+          type: "RichText",
+          options: { placeholder: "Highlight some information...", richTextStyle: "Callout" },
+        },
+      ],
+      appearance: { isBordered: true, hasBackground: false },
+      variants: [
+        {
+          id: "default",
+          name: "Default",
+          layout: { type: "Column", children: ["text"], columnAlign: "Start", columnResizing: "Fill", gap: "Medium" },
+          maxColumns: 1,
+          defaultColumns: 1,
+          appearance: {},
+        },
+      ],
+      defaultVariantKey: "default",
+    },
+    behavior: { dataType: "Item", items: { numberOfItems: 1, allowLinks: false } },
+    editorOptions: {
+      onboarding: {
+        helpText: "Use to highlight a section of text.",
+        documentationLink: "https://learn.supernova.io/latest/documentation/types-of-blocks/text/callout-ZPlZObD1",
+      },
+    },
+    appearance: {
+      isBordered: true,
+      hasBackground: false,
+      isEditorPresentationDifferent: false,
+      showBlockHeaderInEditor: false,
+    },
+  },
+  {
+    id: "io.supernova.block.image",
+    name: "Image",
+    description: "Display an image or Figma image",
+    category: "Media",
+    icon: "https://cdn-assets.supernova.io/blocks/icons/v2/image.svg",
+    searchKeywords: ["image", "figma", "frame", "picture", "photo"],
+    item: {
+      properties: [
+        {
+          id: "image",
+          name: "Image",
+          type: "Image",
+          options: { allowCaption: true },
+        },
+      ],
+      appearance: { isBordered: true, hasBackground: false },
+      variants: [
+        {
+          id: "default",
+          name: "Default",
+          layout: { type: "Column", children: ["image"], columnAlign: "Start", columnResizing: "Fill", gap: "Medium" },
+          maxColumns: 1,
+          defaultColumns: 1,
+          appearance: {},
+        },
+      ],
+      defaultVariantKey: "default",
+    },
+    behavior: { dataType: "Item", items: { numberOfItems: 1, allowLinks: false } },
+    editorOptions: {
+      onboarding: {
+        helpText: "Use to display an image or Figma image.",
+        documentationLink:
+          "https://learn.supernova.io/latest/documentation/types-of-blocks/media-and-assets/image-Ue8VdT8B",
+      },
+    },
+    appearance: {
+      isBordered: false,
+      hasBackground: false,
+      isEditorPresentationDifferent: false,
+      showBlockHeaderInEditor: false,
+    },
+  },
+  {
+    id: "io.supernova.block.shortcut-links",
+    name: "Shortcut links",
+    description: "Link to a page or external URL",
+    category: "Media",
+    icon: "https://cdn-assets.supernova.io/blocks/icons/v2/shortcuts.svg",
+    searchKeywords: ["url", "page", "card"],
+    item: {
+      properties: [
+        {
+          id: "block.links.property.image",
+          name: "Image",
+          type: "Image",
+          options: { aspectRatio: "Landscape", allowCaption: false },
+          variantOptions: {
+            iconOnTop: { width: "Icon", aspectRatio: "Square" },
+            imageOnLeft: { width: "Medium" },
+            iconOnLeft: { width: "Icon", aspectRatio: "Square" },
+          },
+        },
+        {
+          id: "block.links.property.title",
+          name: "Title",
+          type: "Text",
+          options: { textStyle: "Title5", placeholder: "Add title", allowLineBreaks: false },
+        },
+        {
+          id: "block.links.property.description",
+          name: "Short description",
+          type: "Text",
+          options: { textStyle: "Default", color: "NeutralFaded", placeholder: "Add description" },
+        },
+      ],
+      appearance: { isBordered: true, hasBackground: false },
+      variants: [
+        {
+          id: "imageOnTop",
+          name: "Image on top",
+          image: "https://cdn-assets.supernova.io/blocks/variants/shortcuts-image-on-top.svg",
+          layout: {
+            type: "Column",
+            children: ["block.links.property.image", "block.links.property.title", "block.links.property.description"],
+            columnAlign: "Start",
+            columnResizing: "Fill",
+            gap: "Medium",
+          },
+          maxColumns: 4,
+          defaultColumns: 3,
+          appearance: {},
+        },
+        {
+          id: "imageOnLeft",
+          name: "Image on left",
+          image: "https://cdn-assets.supernova.io/blocks/variants/shortcuts-leading-image.svg",
+          layout: {
+            type: "Row",
+            children: [
+              {
+                type: "Column",
+                children: ["block.links.property.image"],
+                columnAlign: "Start",
+                columnResizing: "Hug",
+                gap: "Medium",
+              },
+              {
+                type: "Column",
+                children: ["block.links.property.title", "block.links.property.description"],
+                columnAlign: "Start",
+                columnResizing: "Fill",
+                gap: "Small",
+              },
+            ],
+            columnAlign: "Start",
+            columnResizing: "Fill",
+            gap: "Medium",
+          },
+          maxColumns: 1,
+          defaultColumns: 1,
+          appearance: {},
+        },
+        {
+          id: "iconOnTop",
+          name: "Icon on top",
+          image: "https://cdn-assets.supernova.io/blocks/variants/shortcuts-icon-on-top.svg",
+          layout: {
+            type: "Column",
+            children: ["block.links.property.image", "block.links.property.title", "block.links.property.description"],
+            columnAlign: "Start",
+            columnResizing: "Fill",
+            gap: "Medium",
+          },
+          maxColumns: 4,
+          defaultColumns: 1,
+          appearance: {},
+        },
+        {
+          id: "iconOnLeft",
+          name: "Icon on left",
+          image: "https://cdn-assets.supernova.io/blocks/variants/shortcuts-leading-icon.svg",
+          layout: {
+            type: "Row",
+            children: [
+              {
+                type: "Column",
+                children: ["block.links.property.image"],
+                columnAlign: "Start",
+                columnResizing: "Hug",
+                gap: "Medium",
+              },
+              {
+                type: "Column",
+                children: ["block.links.property.title", "block.links.property.description"],
+                columnAlign: "Start",
+                columnResizing: "Fill",
+                gap: "Small",
+              },
+            ],
+            columnAlign: "Start",
+            columnResizing: "Fill",
+            gap: "Medium",
+          },
+          maxColumns: 2,
+          defaultColumns: 1,
+          appearance: {},
+        },
+      ],
+      defaultVariantKey: "imageOnTop",
+    },
+    behavior: {
+      dataType: "Item",
+      items: { numberOfItems: -1, allowLinks: true, newItemLabel: "Add shortcut" },
+    },
+    editorOptions: {
+      onboarding: {
+        helpText: "Use link block to create single or multiple links to places in or out of your documentation.",
+        documentationLink:
+          "https://learn.supernova.io/latest/documentation/types-of-blocks/links/shortcuts/general-jVfNifo4",
+      },
+      newItemLabel: "Add shortcut",
+    },
+    appearance: {
+      isBordered: true,
+      hasBackground: false,
+      isEditorPresentationDifferent: false,
+      showBlockHeaderInEditor: false,
+    },
+  },
+  {
+    id: "io.supernova.block.embed-figma",
+    name: "Figma embed",
+    description: "Embed a Figma canvas or prototype",
+    category: "Media",
+    icon: "https://cdn-assets.supernova.io/blocks/icons/embed-figma.svg",
+    searchKeywords: ["embed", "figma", "design", "prototype", "canvas"],
+    item: {
+      properties: [
+        {
+          id: "embed",
+          name: "Figma URL",
+          type: "EmbedURL",
+          options: {
+            allowCaption: false,
+            allowResize: true,
+            defaultHeight: 400,
+            urlValidationRegex: "^(https?://)?(www.)?(figma.com)/.+$",
+          },
+        },
+      ],
+      appearance: { isBordered: true, hasBackground: false },
+      variants: [
+        {
+          id: "default",
+          name: "Default",
+          layout: { type: "Column", children: ["embed"], columnAlign: "Start", columnResizing: "Fill", gap: "Medium" },
+          maxColumns: 1,
+          defaultColumns: 1,
+          appearance: {},
+        },
+      ],
+      defaultVariantKey: "default",
+    },
+    behavior: { dataType: "Item", items: { numberOfItems: 1, allowLinks: false } },
+    editorOptions: {
+      onboarding: {
+        helpText: "Embed a Figma canvas or prototype to your documentation.",
+        documentationLink: "https://learn.supernova.io/latest/documentation/types-of-blocks/figma/embed-figma-GPNJsT8A",
+      },
+    },
+    appearance: {
+      isBordered: true,
+      hasBackground: false,
+      isEditorPresentationDifferent: false,
+      showBlockHeaderInEditor: false,
+    },
+  },
+  {
+    id: "io.supernova.block.storybook",
+    name: "Storybook",
+    description: "Embed Storybook canvas",
+    category: "Media",
+    icon: "https://cdn-assets.supernova.io/blocks/icons/storybook.svg",
+    searchKeywords: ["storybook", "story", "stories", "example", "preview", "code", "react"],
+    item: {
+      properties: [
+        {
+          id: "embed",
+          name: "Storybook URL",
+          type: "Storybook",
+          options: {
+            allowCaption: true,
+            allowResize: true,
+            defaultHeight: 400,
+            renderLayoutAs: "Iframe",
+          },
+          variantOptions: {
+            playground: {
+              renderLayoutAs: "Playground",
+              defaultHeight: 400,
+              allowResize: true,
+            },
+          },
+        },
+      ],
+      appearance: {
+        isBordered: true,
+        hasBackground: false,
+      },
+      variants: [
+        {
+          id: "playground",
+          name: "Playground",
+          image: "https://cdn-assets.supernova.io/blocks/variants/storybook-playground.svg",
+          description: "Embed a Storybook story with a preview of the component and controls to adjust the props.",
+          layout: {
+            type: "Column",
+            children: ["embed"],
+            columnAlign: "Start",
+            columnResizing: "Fill",
+            gap: "Medium",
+          },
+          maxColumns: 1,
+          defaultColumns: 1,
+          appearance: {},
+        },
+        {
+          id: "default",
+          name: "HTML iframe",
+          image: "https://cdn-assets.supernova.io/blocks/variants/storybook-iframe.svg",
+          description: "Embed a Storybook story in an iframe.",
+          layout: {
+            type: "Column",
+            children: ["embed"],
+            columnAlign: "Start",
+            columnResizing: "Fill",
+            gap: "Medium",
+          },
+          maxColumns: 1,
+          defaultColumns: 1,
+          appearance: {},
+        },
+      ],
+      defaultVariantKey: "playground",
+    },
+    behavior: {
+      dataType: "Item",
+      items: {
+        numberOfItems: 1,
+        allowLinks: false,
+      },
+    },
+    editorOptions: {
+      onboarding: {
+        helpText: "Embed a Storybook story to your documentation.",
+        documentationLink: "https://learn.supernova.io/latest/documentation/types-of-blocks/code/storybook-1EGPhwBl",
+      },
+    },
+    appearance: {
+      isBordered: true,
+      hasBackground: false,
+      isEditorPresentationDifferent: false,
+      showBlockHeaderInEditor: false,
+    },
+  },
+  {
+    id: "io.supernova.block.embed-youtube",
+    name: "YouTube",
+    description: "Embed a Youtube video",
+    category: "Media",
+    icon: "https://cdn-assets.supernova.io/blocks/icons/embed-youtube.svg",
+    searchKeywords: ["embed", "video", "player", "upload"],
+    item: {
+      properties: [
+        {
+          id: "embed",
+          name: "Youtube URL",
+          type: "EmbedURL",
+          options: {
+            allowCaption: false,
+            allowResize: false,
+            defaultHeight: 400,
+            urlValidationRegex: "^(https?://)?(www.)?(youtube.com|youtu.?be)/.+$",
+          },
+        },
+      ],
+      appearance: { isBordered: true, hasBackground: false },
+      variants: [
+        {
+          id: "default",
+          name: "Default",
+          layout: { type: "Column", children: ["embed"], columnAlign: "Start", columnResizing: "Fill", gap: "Medium" },
+          maxColumns: 1,
+          defaultColumns: 1,
+          appearance: {},
+        },
+      ],
+      defaultVariantKey: "default",
+    },
+    behavior: { dataType: "Item", items: { numberOfItems: 1, allowLinks: false } },
+    editorOptions: {
+      onboarding: {
+        helpText: "Embed a YouTube video to your documentation.",
+        documentationLink:
+          "https://learn.supernova.io/latest/documentation/types-of-blocks/media-and-assets/youtube-Gh8VUrSF",
+      },
+    },
+    appearance: {
+      isBordered: true,
+      hasBackground: false,
+      isEditorPresentationDifferent: false,
+      showBlockHeaderInEditor: false,
+    },
+  },
+  {
+    id: "io.supernova.block.embed-lottie",
+    name: "Lottie animation",
+    description: "Preview a Lottie animation",
+    category: "Media",
+    icon: "https://cdn-assets.supernova.io/blocks/icons/lottie.svg",
+    searchKeywords: ["embed", "lottie", "animation", "rive", "json"],
+    item: {
+      properties: [
+        {
+          id: "url",
+          name: "Lottie URL",
+          type: "URL",
+          description: "Add URL to your Lottie animation file. We support .json and .lottie file extensions.",
+          options: { urlValidationRegex: "^(http|https)://.*.(json|lottie)$" },
+        },
+        {
+          id: "height",
+          name: "Height",
+          type: "Number",
+          options: { defaultValue: 270 },
+        },
+        {
+          id: "width",
+          name: "Width",
+          type: "Number",
+          options: { defaultValue: 400 },
+        },
+        {
+          id: "autoplay",
+          name: "Autoplay",
+          type: "Boolean",
+          options: { defaultValue: true },
+        },
+        {
+          id: "loop",
+          name: "Loop",
+          type: "Boolean",
+          options: { defaultValue: true },
+        },
+        {
+          id: "playerControls",
+          name: "Show player controls",
+          type: "Boolean",
+          options: { defaultValue: true },
+        },
+      ],
+      appearance: { isBordered: true, hasBackground: false },
+      variants: [
+        {
+          id: "default",
+          name: "Default",
+          image: "https://cdn-assets.supernova.io/blocks/variants/lottie-player.svg",
+          description: "Embed a Lottie animation to your documentation.",
+          layout: {
+            type: "Column",
+            children: ["url", "height", "width", "autoplay", "loop", "playerControls"],
+            columnAlign: "Start",
+            columnResizing: "Fill",
+            gap: "Medium",
+          },
+          maxColumns: 1,
+          defaultColumns: 1,
+          appearance: {},
+        },
+      ],
+      defaultVariantKey: "default",
+    },
+    behavior: { dataType: "Item", items: { numberOfItems: 1, allowLinks: false } },
+    editorOptions: {
+      onboarding: {
+        helpText: "Embed a Lottie animation to your documentation.",
+        documentationLink:
+          "https://learn.supernova.io/latest/documentation/types-of-blocks/media-and-assets/lottie-preview-7CqFdGv9",
+      },
+    },
+    appearance: {
+      isBordered: true,
+      hasBackground: false,
+      isEditorPresentationDifferent: true,
+      showBlockHeaderInEditor: true,
+    },
+  },
+  {
+    id: "io.supernova.block.embed",
+    name: "Embed",
+    description: "Embed a generic URL",
+    category: "Media",
+    icon: "https://cdn-assets.supernova.io/blocks/icons/embed.svg",
+    searchKeywords: ["embed", "url", "iframe", "site", "import"],
+    item: {
+      properties: [
+        {
+          id: "embedUrl",
+          name: "Embed URL",
+          type: "EmbedURL",
+          options: {
+            allowCaption: true,
+            allowResize: true,
+            defaultHeight: 400,
+            urlValidationRegex: "^(https?://)?(www.)?.+$",
+          },
+        },
+      ],
+      appearance: { isBordered: true, hasBackground: false },
+      variants: [
+        {
+          id: "default",
+          name: "Default",
+          layout: {
+            type: "Column",
+            children: ["embedUrl"],
+            columnAlign: "Start",
+            columnResizing: "Fill",
+            gap: "Medium",
+          },
+          maxColumns: 1,
+          defaultColumns: 1,
+          appearance: {},
+        },
+      ],
+      defaultVariantKey: "default",
+    },
+    behavior: { dataType: "Item", items: { numberOfItems: 1, allowLinks: false } },
+    editorOptions: {
+      onboarding: {
+        helpText: "Embed any page to your documentation as an iframe.",
+        documentationLink:
+          "https://learn.supernova.io/latest/documentation/types-of-blocks/media-and-assets/embed/public-url-2ZeRQ332",
+      },
+    },
+    appearance: {
+      isBordered: true,
+      hasBackground: false,
+      isEditorPresentationDifferent: false,
+      showBlockHeaderInEditor: false,
+    },
+  },
+  {
+    id: "io.supernova.block.markdown",
+    name: "Markdown",
+    description: "Render Markdown URL",
+    category: "Other",
+    icon: "https://cdn-assets.supernova.io/blocks/icons/markdown.svg",
+    searchKeywords: ["md", "embed", "api", "props", "mdx"],
+    item: {
+      properties: [
+        {
+          id: "markdownUrl",
+          name: "Markdown URL",
+          type: "Markdown",
+          options: { urlValidationRegex: "^(https?://)?(www\\.)?.+\\.md(\\?.*)?$" },
+        },
+      ],
+      appearance: { isBordered: true, hasBackground: false },
+      variants: [
+        {
+          id: "plain",
+          name: "Plain",
+          image: "https://cdn-assets.supernova.io/blocks/variants/markdown-plain.svg",
+          layout: {
+            type: "Column",
+            children: ["markdownUrl"],
+            columnAlign: "Start",
+            columnResizing: "Fill",
+            gap: "Medium",
+          },
+          maxColumns: 1,
+          defaultColumns: 1,
+          appearance: {},
+        },
+        {
+          id: "bordered",
+          name: "Bordered",
+          image: "https://cdn-assets.supernova.io/blocks/variants/markdown-bordered.svg",
+          layout: {
+            type: "Column",
+            children: ["markdownUrl"],
+            columnAlign: "Start",
+            columnResizing: "Fill",
+            gap: "Medium",
+          },
+          maxColumns: 1,
+          defaultColumns: 1,
+          appearance: {},
+        },
+        {
+          id: "boxed",
+          name: "Boxed",
+          image: "https://cdn-assets.supernova.io/blocks/variants/markdown-boxed.svg",
+          layout: {
+            type: "Column",
+            children: ["markdownUrl"],
+            columnAlign: "Start",
+            columnResizing: "Fill",
+            gap: "Medium",
+          },
+          maxColumns: 1,
+          defaultColumns: 1,
+          appearance: {},
+        },
+      ],
+      defaultVariantKey: "plain",
+    },
+    behavior: { dataType: "Item", items: { numberOfItems: 1, allowLinks: false } },
+    editorOptions: {
+      onboarding: {
+        helpText: "Render any markdown file directly inside of your documentation.",
+        documentationLink:
+          "https://learn.supernova.io/latest/documentation/types-of-blocks/code/markdown/general-B8wQVOem",
+      },
+    },
+    appearance: {
+      isBordered: true,
+      hasBackground: false,
+      isEditorPresentationDifferent: true,
+      showBlockHeaderInEditor: false,
+    },
+  },
+  {
+    id: "io.supernova.block.table",
+    name: "Table",
+    description: "Display a simple table",
+    category: "Layout",
+    icon: "https://cdn-assets.supernova.io/blocks/icons/v2/table.svg",
+    searchKeywords: ["grid", "data", "spreadsheet", "api"],
+    item: {
+      properties: [{ id: "table", name: "Table", type: "Table", options: {} }],
+      appearance: { isBordered: true, hasBackground: false },
+      variants: [
+        {
+          id: "default",
+          name: "Default",
+          layout: { type: "Column", children: ["table"], columnAlign: "Start", columnResizing: "Fill", gap: "Medium" },
+          maxColumns: 1,
+          defaultColumns: 1,
+          appearance: {},
+        },
+      ],
+      defaultVariantKey: "default",
+    },
+    behavior: { dataType: "Item", items: { numberOfItems: 1, allowLinks: false } },
+    editorOptions: {
+      onboarding: {
+        helpText: "Use for displaying data in a tabular format.",
+        documentationLink: "https://learn.supernova.io/latest/documentation/types-of-blocks/layout/table-R8KGnxej",
+      },
+    },
+    appearance: {
+      isBordered: true,
+      hasBackground: false,
+      isEditorPresentationDifferent: false,
+      showBlockHeaderInEditor: false,
+    },
+  },
+  {
+    id: "io.supernova.block.design-tokens",
+    name: "Design tokens",
+    description: "A list of design tokens",
+    category: "Tokens",
+    icon: "https://cdn-assets.supernova.io/blocks/icons/v2/design-tokens.svg",
+    searchKeywords: [
+      "tokens",
+      "color",
+      "typography",
+      "spacing",
+      "grid",
+      "material",
+      "theme",
+      "token list",
+      "token group",
+    ],
+    item: {
+      properties: [
+        {
+          id: "tokens",
+          name: "Tokens",
+          type: "Token",
+          options: { renderLayoutAs: "List", defaultTheme: "none", defaultValuePreview: "Split" },
+          variantOptions: { grid: { renderLayoutAs: "Grid" } },
+        },
+      ],
+      appearance: { isBordered: true, hasBackground: false },
+      variants: [
+        {
+          id: "table",
+          name: "Table",
+          image: "https://cdn-assets.supernova.io/blocks/variants/tokens-table.svg",
+          layout: { type: "Column", children: ["tokens"], columnAlign: "Start", columnResizing: "Fill", gap: "Medium" },
+          maxColumns: 1,
+          defaultColumns: 1,
+          appearance: {},
+        },
+        {
+          id: "grid",
+          name: "Grid",
+          image: "https://cdn-assets.supernova.io/blocks/variants/tokens-grid.svg",
+          layout: { type: "Column", children: ["tokens"], columnAlign: "Start", columnResizing: "Fill", gap: "Medium" },
+          maxColumns: 4,
+          defaultColumns: 1,
+          appearance: {},
+        },
+      ],
+      defaultVariantKey: "table",
+    },
+    behavior: { dataType: "Token", entities: { selectionType: "EntityAndGroup", maxSelected: 0 } },
+    editorOptions: {
+      onboarding: {
+        helpText: "Show a group of design tokens. Automatically display all subgroups too.",
+        documentationLink:
+          "https://learn.supernova.io/latest/documentation/types-of-blocks/token/tokens/general-84NRgxGl#section-token-group-09",
+      },
+    },
+    appearance: {
+      isBordered: true,
+      hasBackground: false,
+      isEditorPresentationDifferent: false,
+      showBlockHeaderInEditor: false,
+    },
+  },
+  {
+    id: "io.supernova.block.token-color-ramps",
+    name: "Color ramps",
+    description: "The best way to display colors",
+    category: "Tokens",
+    icon: "https://cdn-assets.supernova.io/blocks/icons/color-ramp.svg",
+    searchKeywords: ["tokens", "ramp", "shades", "palette", "spectrum", "stack", "range", "swatch"],
+    item: {
+      properties: [
+        {
+          id: "tokens",
+          name: "Tokens",
+          type: "Token",
+          options: { allowedTypes: ["Color"], allowPropertySelection: false, allowThemeSelection: true },
+        },
+      ],
+      appearance: { isBordered: true, hasBackground: false },
+      variants: [
+        {
+          id: "default",
+          name: "Default",
+          image: "https://cdn-assets.supernova.io/blocks/variants/tokens-color-stack.svg",
+          layout: { type: "Column", children: ["tokens"], columnAlign: "Start", columnResizing: "Fill", gap: "Medium" },
+          maxColumns: 2,
+          defaultColumns: 1,
+          appearance: { isEditorPresentationDifferent: true },
+        },
+      ],
+      defaultVariantKey: "default",
+    },
+    behavior: { dataType: "Token", entities: { selectionType: "EntityAndGroup", maxSelected: 0 } },
+    editorOptions: {
+      onboarding: { helpText: "The best way to display colors", documentationLink: "https://learn.supernova.io" },
+    },
+    appearance: {
+      isBordered: true,
+      hasBackground: false,
+      isEditorPresentationDifferent: false,
+      showBlockHeaderInEditor: false,
+    },
+  },
+  {
+    id: "io.supernova.block.color-accessibility-grid",
+    name: "Accessibility color grid",
+    description: "Visualize accessibility of your color tokens",
+    category: "Tokens",
+    icon: "https://cdn-assets.supernova.io/blocks/icons/v3/token-accessibility-grid.svg",
+    searchKeywords: ["tokens", "color", "accessibility", "grid", "contrast"],
+    item: {
+      properties: [
+        {
+          id: "tokens",
+          name: "Tokens",
+          type: "Token",
+          options: { allowedTypes: ["Color"], allowPropertySelection: false, allowThemeSelection: false },
+        },
+      ],
+      appearance: { isBordered: true, hasBackground: false },
+      variants: [
+        {
+          id: "default",
+          name: "Default",
+          image: "https://cdn-assets.supernova.io/blocks/variants/contrast-grid-large.svg",
+          description:
+            "Visualize accessibility of your colors by automatically calculating their color contrast ratio.",
+          layout: { type: "Column", children: ["tokens"], columnAlign: "Start", columnResizing: "Fill", gap: "Medium" },
+          maxColumns: 1,
+          defaultColumns: 1,
+          appearance: { isEditorPresentationDifferent: true },
+        },
+      ],
+      defaultVariantKey: "default",
+    },
+    behavior: { dataType: "Token", entities: { selectionType: "EntityAndGroup", maxSelected: 0 } },
+    editorOptions: {
+      onboarding: {
+        helpText: "Visualize accessibility of your colors by automatically calculating their color contrast ratio.",
+        documentationLink: "https://learn.supernova.io",
+      },
+    },
+    appearance: {
+      isBordered: true,
+      hasBackground: false,
+      isEditorPresentationDifferent: false,
+      showBlockHeaderInEditor: false,
+    },
+  },
+  {
+    id: "io.supernova.block.code",
+    name: "Code",
+    description: "Display simple code examples",
+    category: "Code",
+    icon: "https://cdn-assets.supernova.io/blocks/icons/code.svg",
+    searchKeywords: ["code"],
+    item: {
+      properties: [
+        {
+          id: "code",
+          name: "Code",
+          type: "Code",
+          options: {},
+        },
+      ],
+      appearance: {
+        isBordered: true,
+        hasBackground: false,
+      },
+      variants: [
+        {
+          id: "default",
+          name: "Default",
+          layout: {
+            type: "Column",
+            children: ["code"],
+            columnAlign: "Start",
+            columnResizing: "Fill",
+            gap: "Medium",
+          },
+          maxColumns: 1,
+          defaultColumns: 1,
+          appearance: {},
+        },
+      ],
+      defaultVariantKey: "default",
+    },
+    behavior: {
+      dataType: "Item",
+      items: {
+        numberOfItems: 1,
+        allowLinks: false,
+      },
+    },
+    editorOptions: {
+      onboarding: {
+        helpText: "Display simple code examples",
+      },
+    },
+    appearance: {
+      isBordered: false,
+      hasBackground: false,
+      isEditorPresentationDifferent: false,
+      showBlockHeaderInEditor: false,
+    },
+  },
+  {
+    id: "io.supernova.block.code-react",
+    name: "React code",
+    description: "Render a code snippet",
+    category: "Code",
+    icon: "https://cdn-assets.supernova.io/blocks/icons/v3/code-react.svg",
+    searchKeywords: ["code", "react", "snippet", "storybook", "editor", "example", "sandbox"],
+    item: {
+      properties: [
+        {
+          id: "code",
+          name: "Code",
+          type: "CodeSandbox",
+          options: { renderLayoutAs: "PreviewOnTop" },
+          variantOptions: {
+            codeTop: { renderLayoutAs: "PreviewOnBottom" },
+            codeLeft: { renderLayoutAs: "PreviewOnRight" },
+            codeRight: { renderLayoutAs: "PreviewOnLeft" },
+          },
+        },
+      ],
+      appearance: { isBordered: true, hasBackground: false },
+      variants: [
+        {
+          id: "codeBottom",
+          name: "Full width, code bottom",
+          image: "https://cdn-assets.supernova.io/blocks/variants/react-code-bottom.svg",
+          description: "Full-width block of code, with a preview on top.",
+          layout: { type: "Column", children: ["code"], columnAlign: "Start", columnResizing: "Fill", gap: "Medium" },
+          maxColumns: 1,
+          defaultColumns: 1,
+          appearance: {},
+        },
+        {
+          id: "codeTop",
+          name: "Full width, code top",
+          image: "https://cdn-assets.supernova.io/blocks/variants/react-code-top.svg",
+          description: "Full-width block of code, with a preview on bottom.",
+          layout: { type: "Column", children: ["code"], columnAlign: "Start", columnResizing: "Fill", gap: "Medium" },
+          maxColumns: 1,
+          defaultColumns: 1,
+          appearance: {},
+        },
+        {
+          id: "codeLeft",
+          name: "Side by side, code left",
+          image: "https://cdn-assets.supernova.io/blocks/variants/react-code-left.svg",
+          description: "Side-by-side preview and code, with code on the left.",
+          layout: { type: "Column", children: ["code"], columnAlign: "Start", columnResizing: "Fill", gap: "Medium" },
+          maxColumns: 1,
+          defaultColumns: 1,
+          appearance: {},
+        },
+        {
+          id: "codeRight",
+          name: "Side by side, code right",
+          image: "https://cdn-assets.supernova.io/blocks/variants/react-code-right.svg",
+          description: "Side-by-side preview and code, with code on the right.",
+          layout: { type: "Column", children: ["code"], columnAlign: "Start", columnResizing: "Fill", gap: "Medium" },
+          maxColumns: 1,
+          defaultColumns: 1,
+          appearance: {},
+        },
+      ],
+      defaultVariantKey: "codeBottom",
+    },
+    behavior: { dataType: "Item", items: { numberOfItems: 1, allowLinks: false } },
+    editorOptions: {
+      onboarding: {
+        helpText: "Display rendered code example",
+        documentationLink:
+          "https://learn.supernova.io/latest/documentation/types-of-blocks/code/render-react-code-vxufnkFm",
+      },
+    },
+    appearance: {
+      isBordered: false,
+      hasBackground: false,
+      isEditorPresentationDifferent: false,
+      showBlockHeaderInEditor: false,
+    },
+  },
+  {
+    id: "io.supernova.block.assets",
+    name: "Vector assets",
+    description: "Display icons or illustrations",
+    category: "Assets",
+    icon: "https://cdn-assets.supernova.io/blocks/icons/v2/assets.svg",
+    searchKeywords: ["icons", "illustrations", "grid", "svg", "logos", "vectors"],
+    item: {
+      properties: [
+        {
+          id: "assets",
+          name: "Assets",
+          type: "Asset",
+          options: {},
+        },
+      ],
+      appearance: {
+        isBordered: true,
+        hasBackground: false,
+      },
+      variants: [
+        {
+          id: "default",
+          name: "Simple grid",
+          image: "https://cdn-assets.supernova.io/blocks/variants/assets-simple-grid.svg",
+          description: "A simple grid. Both the title and description are displayed below the preview.",
+          layout: {
+            type: "Column",
+            children: ["assets"],
+            columnAlign: "Start",
+            columnResizing: "Fill",
+            gap: "Medium",
+          },
+          maxColumns: 8,
+          defaultColumns: 4,
+          appearance: {},
+        },
+        {
+          id: "square-grid",
+          name: "Square grid",
+          image: "https://cdn-assets.supernova.io/blocks/variants/assets-square-grid.svg",
+          description: "Bordered square grid tailored for displaying icon assets.",
+          layout: {
+            type: "Column",
+            children: ["assets"],
+            columnAlign: "Start",
+            columnResizing: "Fill",
+            gap: "Medium",
+          },
+          maxColumns: 8,
+          defaultColumns: 4,
+          appearance: {
+            isEditorPresentationDifferent: true,
+          },
+        },
+        {
+          id: "borderless-grid",
+          name: "Borderless grid",
+          image: "https://cdn-assets.supernova.io/blocks/variants/assets-borderless-grid.svg",
+          description: "Borderless grid, perfect for displaying vector assets of the same height.",
+          layout: {
+            type: "Column",
+            children: ["assets"],
+            columnAlign: "Start",
+            columnResizing: "Fill",
+            gap: "Medium",
+          },
+          maxColumns: 8,
+          defaultColumns: 4,
+          appearance: {
+            isEditorPresentationDifferent: true,
+          },
+        },
+      ],
+      defaultVariantKey: "default",
+    },
+    behavior: {
+      dataType: "Asset",
+      entities: {
+        selectionType: "EntityAndGroup",
+        maxSelected: 0,
+      },
+    },
+    editorOptions: {
+      onboarding: {
+        helpText: "Display a grid of icons or illustrations.",
+        documentationLink:
+          "https://learn.supernova.io/latest/documentation/types-of-blocks/media-and-assets/asset/general-xa6EgXb2",
+      },
+    },
+    appearance: {
+      isBordered: true,
+      hasBackground: false,
+      isEditorPresentationDifferent: false,
+      showBlockHeaderInEditor: false,
+    },
+  },
+  {
+    id: "io.supernova.block.figma-frames",
+    name: "Figma images",
+    description: "Generate images from Figma layers",
+    category: "Figma",
+    icon: "https://cdn-assets.supernova.io/blocks/icons/v2/figma-frames.svg",
+    searchKeywords: ["figma", "frames", "image", "layer"],
+    item: {
+      properties: [
+        {
+          id: "figmaNodes",
+          name: "Figma Frames",
+          type: "FigmaNode",
+          options: {},
+        },
+      ],
+      appearance: { isBordered: true, hasBackground: false },
+      variants: [
+        {
+          id: "bordered",
+          name: "Bordered",
+          image: "https://cdn-assets.supernova.io/blocks/variants/figma-nodes-boxed.svg",
+          description: "Tiles with background and border, great for larger sets of frames.",
+          layout: {
+            type: "Column",
+            children: ["figmaNodes"],
+            columnAlign: "Start",
+            columnResizing: "Fill",
+            gap: "Medium",
+          },
+          maxColumns: 8,
+          defaultColumns: 1,
+          appearance: {},
+        },
+        {
+          id: "plain",
+          name: "Plain",
+          image: "https://cdn-assets.supernova.io/blocks/variants/figma-nodes-plain.svg",
+          description: "Frame as it is in Figma with no extra formatting, great for single images.",
+          layout: {
+            type: "Column",
+            children: ["figmaNodes"],
+            columnAlign: "Start",
+            columnResizing: "Fill",
+            gap: "Medium",
+          },
+          maxColumns: 8,
+          defaultColumns: 1,
+          appearance: {},
+        },
+      ],
+      defaultVariantKey: "bordered",
+    },
+    behavior: { dataType: "FigmaNode", entities: { selectionType: "Entity", maxSelected: 0 } },
+    editorOptions: {
+      onboarding: {
+        helpText: "Generate images from Figma layers",
+        documentationLink:
+          "https://learn.supernova.io/latest/documentation/types-of-blocks/figma/figma-frames/general-f3IYC5dg",
+      },
+    },
+    appearance: {
+      isBordered: true,
+      hasBackground: false,
+      isEditorPresentationDifferent: false,
+      showBlockHeaderInEditor: false,
+    },
+  },
+  {
+    id: "io.supernova.block.release-notes",
+    name: "Release notes",
+    description: "Show version release notes",
+    category: "Other",
+    icon: "https://cdn-assets.supernova.io/blocks/icons/release-notes.svg",
+    searchKeywords: ["version", "changelog", "history"],
+    item: {
+      properties: [],
+      appearance: { isBordered: true, hasBackground: false },
+      variants: [
+        {
+          id: "default",
+          name: "Default",
+          image: "https://cdn-assets.supernova.io/blocks/variants/release-notes-2.svg",
+          description: "Show formatted release notes from all previously released versions.",
+          layout: { type: "Column", children: [], columnAlign: "Start", columnResizing: "Fill", gap: "Medium" },
+          maxColumns: 1,
+          defaultColumns: 1,
+          appearance: {},
+        },
+      ],
+      defaultVariantKey: "default",
+    },
+    behavior: { dataType: "Item", items: { numberOfItems: 1, allowLinks: false } },
+    editorOptions: {
+      onboarding: {
+        helpText: "Show formatted release notes from all previously released versions.",
+      },
+    },
+    appearance: {
+      isBordered: true,
+      hasBackground: false,
+      isEditorPresentationDifferent: true,
+      showBlockHeaderInEditor: true,
+    },
+  },
+  {
+    id: "io.supernova.block.component-checklist",
+    name: "Component checklist",
+    description: "Highlight specific component properties",
+    category: "Components",
+    icon: "https://cdn-assets.supernova.io/blocks/icons/v2/component-checklist.svg",
+    searchKeywords: ["components", "health", "properties", "overview", "status"],
+    item: {
+      properties: [
+        {
+          id: "components",
+          name: "Components",
+          type: "Component",
+          options: { renderLayoutAs: "List" },
+        },
+        {
+          id: "title",
+          name: "Title",
+          type: "Text",
+          options: { defaultValue: "Component checklist" },
+        },
+        {
+          id: "showDescription",
+          name: "Show description",
+          type: "Boolean",
+          options: { defaultValue: true },
+        },
+      ],
+      appearance: { isBordered: true, hasBackground: false },
+      variants: [
+        {
+          id: "default",
+          name: "Default",
+          image: "https://cdn-assets.supernova.io/blocks/variants/component-checklist.svg",
+          layout: {
+            type: "Column",
+            children: ["components", "showDescription"],
+            columnAlign: "Start",
+            columnResizing: "Fill",
+            gap: "Medium",
+          },
+          maxColumns: 1,
+          defaultColumns: 1,
+          appearance: { isEditorPresentationDifferent: true },
+        },
+      ],
+      defaultVariantKey: "default",
+    },
+    behavior: { dataType: "Component", entities: { selectionType: "Entity", maxSelected: 1 } },
+    editorOptions: {
+      onboarding: {
+        helpText: "Highlight specific component properties",
+        documentationLink:
+          "https://learn.supernova.io/latest/documentation/types-of-blocks/component/component-checklist-NXepPIpZ",
+      },
+    },
+    appearance: {
+      isBordered: true,
+      hasBackground: false,
+      isEditorPresentationDifferent: false,
+      showBlockHeaderInEditor: false,
+    },
+  },
+  {
+    id: "io.supernova.block.component-checklist-all",
+    name: "Component overview table",
+    description: "Show an overview of all components",
+    category: "Components",
+    icon: "https://cdn-assets.supernova.io/blocks/icons/component-overview-table.svg",
+    searchKeywords: ["components", "health", "overview", "status"],
+    item: {
+      properties: [
+        {
+          id: "components",
+          name: "Components",
+          type: "Component",
+          options: { renderLayoutAs: "Table" },
+        },
+        {
+          id: "showLastUpdatedColumn",
+          name: "Show last updated column",
+          type: "Boolean",
+          options: { defaultValue: true },
+        },
+      ],
+      appearance: { isBordered: true, hasBackground: false },
+      variants: [
+        {
+          id: "default",
+          name: "Default",
+          image: "https://cdn-assets.supernova.io/blocks/variants/component-overview-table.svg",
+          layout: {
+            type: "Column",
+            children: ["components", "showLastUpdatedColumn"],
+            columnAlign: "Start",
+            columnResizing: "Fill",
+            gap: "Medium",
+          },
+          maxColumns: 1,
+          defaultColumns: 1,
+          appearance: { isEditorPresentationDifferent: true },
+        },
+      ],
+      defaultVariantKey: "default",
+    },
+    behavior: { dataType: "Component", entities: { selectionType: "Group", maxSelected: 1 } },
+    editorOptions: {
+      onboarding: {
+        helpText: "Show an overview of all your components",
+        documentationLink:
+          "https://learn.supernova.io/latest/documentation/types-of-blocks/component/component-overview-table-W8eOtJ5t",
+      },
+    },
+    appearance: {
+      isBordered: true,
+      hasBackground: false,
+      isEditorPresentationDifferent: false,
+      showBlockHeaderInEditor: false,
+    },
+  },
+  {
+    id: "io.supernova.block.component-health",
+    name: "Component health",
+    description: "Show component health and other attributes",
+    category: "Components",
+    icon: "https://cdn-assets.supernova.io/blocks/icons/v2/component-health.svg",
+    searchKeywords: ["components", "health", "properties", "overview", "status"],
+    item: {
+      properties: [
+        {
+          id: "components",
+          name: "Components",
+          type: "Component",
+          options: { renderLayoutAs: "List" },
+        },
+      ],
+      appearance: { isBordered: true, hasBackground: false },
+      variants: [
+        {
+          id: "default",
+          name: "Default",
+          image: "https://cdn-assets.supernova.io/blocks/variants/component-health.svg",
+          layout: {
+            type: "Column",
+            children: ["components"],
+            columnAlign: "Start",
+            columnResizing: "Fill",
+            gap: "Medium",
+          },
+          maxColumns: 1,
+          defaultColumns: 1,
+          appearance: { isEditorPresentationDifferent: true },
+        },
+      ],
+      defaultVariantKey: "default",
+    },
+    behavior: { dataType: "Component", entities: { selectionType: "Entity", maxSelected: 1 } },
+    editorOptions: {
+      onboarding: {
+        helpText: "Show component health and additional attributes",
+        documentationLink:
+          "https://learn.supernova.io/latest/documentation/types-of-blocks/component/component-health-sezSxEED",
+      },
+    },
+    appearance: {
+      isBordered: true,
+      hasBackground: false,
+      isEditorPresentationDifferent: false,
+      showBlockHeaderInEditor: false,
+    },
+  },
+  {
+    id: "io.supernova.block.figma-components",
+    name: "Figma component",
+    description: "Display components and variants from Figma",
+    category: "Figma",
+    icon: "https://cdn-assets.supernova.io/blocks/icons/figma-component.svg",
+    searchKeywords: ["variants", "properties"],
+    item: {
+      properties: [
+        {
+          id: "figmaComponent",
+          name: "Figma component",
+          type: "FigmaComponent",
+          options: {
+            renderLayoutAs: "Grid",
+          },
+          variantOptions: {
+            canvas: {
+              renderLayoutAs: "Canvas",
+            },
+          },
+        },
+      ],
+      appearance: {
+        isBordered: true,
+        hasBackground: false,
+      },
+      variants: [
+        {
+          id: "grid",
+          name: "Grid",
+          image: "https://cdn-assets.supernova.io/blocks/variants/figma-component-grid.svg",
+          description: "Components or variants will be rendered individually in a grid layout",
+          layout: {
+            type: "Column",
+            children: ["figmaComponent"],
+            columnAlign: "Start",
+            columnResizing: "Fill",
+            gap: "Medium",
+          },
+          maxColumns: 4,
+          defaultColumns: 1,
+          appearance: {},
+        },
+        {
+          id: "canvas",
+          name: "Canvas",
+          image: "https://cdn-assets.supernova.io/blocks/variants/figma-component-canvas.svg",
+          description: "Components or variants will be rendered on a single canvas",
+          layout: {
+            type: "Column",
+            children: ["figmaComponent"],
+            columnAlign: "Start",
+            columnResizing: "Fill",
+            gap: "Medium",
+          },
+          maxColumns: 4,
+          defaultColumns: 1,
+          appearance: {},
+        },
+      ],
+      defaultVariantKey: "grid",
+    },
+    behavior: {
+      dataType: "FigmaComponent",
+      entities: {
+        selectionType: "Entity",
+        maxSelected: 0,
+      },
+    },
+    editorOptions: {
+      onboarding: {
+        helpText: "Display Figma component variants or group of components.",
+        documentationLink:
+          "https://learn.supernova.io/latest/documentation/types-of-blocks/token/tokens/general-84NRgxGl#section-token-group-09",
+      },
+    },
+    appearance: {
+      isBordered: true,
+      hasBackground: false,
+      isEditorPresentationDifferent: false,
+      showBlockHeaderInEditor: false,
+    },
+  },
+  {
+    id: "io.supernova.block.figma-components-propstable",
+    name: "Figma component properties",
+    description: "Display list of Figma component properties",
+    category: "Figma",
+    icon: "https://cdn-assets.supernova.io/blocks/icons/figma-component-properties.svg",
+    searchKeywords: ["variants", "properties", "props", "table"],
+    item: {
+      properties: [
+        {
+          id: "figmaComponent",
+          name: "Figma component",
+          type: "FigmaComponent",
+          options: {
+            renderLayoutAs: "PropsTable",
+            invertPropertySelection: true,
+          },
+        },
+      ],
+      appearance: {
+        isBordered: true,
+        hasBackground: false,
+      },
+      variants: [
+        {
+          id: "default",
+          name: "Default",
+          layout: {
+            type: "Column",
+            children: ["figmaComponent"],
+            columnAlign: "Start",
+            columnResizing: "Fill",
+            gap: "Medium",
+          },
+          maxColumns: 1,
+          defaultColumns: 1,
+          appearance: {},
+        },
+      ],
+      defaultVariantKey: "default",
+    },
+    behavior: {
+      dataType: "FigmaComponent",
+      entities: {
+        selectionType: "Entity",
+        maxSelected: 1,
+      },
+    },
+    editorOptions: {
+      onboarding: {
+        helpText: "Display properties based on Figma component data.",
+        documentationLink: "",
+      },
+    },
+    appearance: {
+      isBordered: true,
+      hasBackground: false,
+      isEditorPresentationDifferent: false,
+      showBlockHeaderInEditor: false,
+    },
+  },
+  {
+    id: "io.supernova.block.files",
+    name: "File upload",
+    description: "Display attachments for download",
+    category: "Media",
+    icon: "https://cdn-assets.supernova.io/blocks/icons/files.svg",
+    searchKeywords: ["files", "attachments", "download", "upload"],
+    item: {
+      properties: [
+        {
+          id: "files",
+          name: "Files",
+          type: "File",
+          options: {
+            renderLayoutAs: "iconOnLeft",
+          },
+          variantOptions: {
+            iconOnTop: {
+              renderLayoutAs: "iconOnTop",
+            },
+            iconOnLeft: {
+              renderLayoutAs: "iconOnLeft",
+            },
+          },
+        },
+      ],
+      appearance: {
+        isBordered: true,
+        hasBackground: false,
+      },
+      variants: [
+        {
+          id: "iconOnTop",
+          name: "Icon on top",
+          image: "https://cdn-assets.supernova.io/blocks/variants/files-icon-on-top.svg",
+          layout: {
+            type: "Column",
+            children: ["files"],
+            columnAlign: "Start",
+            columnResizing: "Fill",
+            gap: "Medium",
+          },
+          maxColumns: 4,
+          defaultColumns: 1,
+          appearance: {},
+        },
+        {
+          id: "iconOnLeft",
+          name: "Icon on left",
+          image: "https://cdn-assets.supernova.io/blocks/variants/files-leading-icon.svg",
+          layout: {
+            type: "Column",
+            children: ["files"],
+            columnAlign: "Start",
+            columnResizing: "Fill",
+            gap: "Medium",
+          },
+          maxColumns: 2,
+          defaultColumns: 1,
+          appearance: {},
+        },
+      ],
+      defaultVariantKey: "iconOnTop",
+    },
+    behavior: {
+      dataType: "File",
+      entities: {
+        selectionType: "Entity",
+        maxSelected: 0,
+      },
+    },
+    editorOptions: {
+      onboarding: {
+        helpText: "Display attachments for download",
+        documentationLink: "https://learn.supernova.io/file-upload-block",
+      },
+    },
+    appearance: {
+      isBordered: false,
+      hasBackground: false,
+      isEditorPresentationDifferent: false,
+      showBlockHeaderInEditor: false,
+    },
+  },
+];