npm - @supernova-studio/client - Versions diffs - 0.30.1 → 0.32.0 - Mend

@supernova-studio/client 0.30.1 → 0.32.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (14) hide show

package/dist/index.d.mts +60 -104
package/dist/index.d.ts +60 -104
package/dist/index.js +583 -1501
package/dist/index.js.map +1 -1
package/dist/index.mjs +569 -1487
package/dist/index.mjs.map +1 -1
package/package.json +1 -1
package/src/api/dto/elements/documentation/group.ts +3 -2
package/src/yjs/design-system-content/documentation-hierarchy.ts +3 -1
package/src/yjs/docs-editor/blocks-to-prosemirror.ts +125 -105
package/src/yjs/docs-editor/list-tree-builder.ts +194 -0
package/src/yjs/docs-editor/mock.ts +301 -1361
package/src/yjs/docs-editor/prosemirror/schema.ts +3 -0
package/src/yjs/docs-editor/prosemirror-to-blocks.ts +1 -1

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

@@ -20,7 +20,7 @@ const blocks: PageBlockDefinition[] = [
     name: "Text",
     description: "Plain text",
     category: "Text",
-    icon: "https://cdn-assets.supernova.io/blocks/icons/text.svg",
+    icon: "https://cdn-assets.supernova.io/blocks/icons/v2/text.svg",
     searchKeywords: ["paragraph", "rich text"],
     item: {
       properties: [
@@ -28,369 +28,220 @@ const blocks: PageBlockDefinition[] = [
           id: "text",
           name: "Text",
           type: "RichText",
-          options: {
-            richTextStyle: "Default",
-          },
+          options: { richTextStyle: "Default" },
         },
       ],
-      appearance: {
-        isBordered: false,
-        hasBackground: false,
-      },
+      appearance: { isBordered: true, hasBackground: false },
       variants: [
         {
           id: "default",
           name: "Default",
-          layout: {
-            type: "Column",
-            children: ["text"],
-            columnAlign: "Start",
-            columnResizing: "Fill",
-            gap: "Medium",
-          },
+          layout: { type: "Column", children: ["text"], columnAlign: "Start", columnResizing: "Fill", gap: "Medium" },
           maxColumns: 1,
           defaultColumns: 1,
-          appearance: {
-            isBordered: false,
-            hasBackground: false,
-            isEditorPresentationDifferent: false,
-          },
+          appearance: { isBordered: true, hasBackground: false, isEditorPresentationDifferent: false },
         },
       ],
       defaultVariantKey: "default",
     },
-    behavior: {
-      dataType: "Item",
-      items: {
-        numberOfItems: 1,
-        allowLinks: false,
-      },
-    },
+    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: false,
-      hasBackground: false,
-    },
+    appearance: { isBordered: true, hasBackground: false },
   },
   {
     id: "io.supernova.block.title1",
-    name: "Title 1",
+    name: "Heading 1",
     description: "Main sections within the page",
     category: "Text",
-    icon: "https://cdn-assets.supernova.io/blocks/icons/title-1.svg",
-    searchKeywords: ["heading", "h1"],
+    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: "Title 1",
-            richTextStyle: "Title1",
-          },
+          options: { placeholder: "Heading 1", richTextStyle: "Title1" },
         },
       ],
-      appearance: {
-        isBordered: false,
-        hasBackground: false,
-      },
+      appearance: { isBordered: true, hasBackground: false },
       variants: [
         {
           id: "default",
           name: "Default",
-          layout: {
-            type: "Column",
-            children: ["text"],
-            columnAlign: "Start",
-            columnResizing: "Fill",
-            gap: "Medium",
-          },
+          layout: { type: "Column", children: ["text"], columnAlign: "Start", columnResizing: "Fill", gap: "Medium" },
           maxColumns: 1,
           defaultColumns: 1,
-          appearance: {
-            isBordered: false,
-            hasBackground: false,
-            isEditorPresentationDifferent: false,
-          },
+          appearance: { isBordered: true, hasBackground: false, isEditorPresentationDifferent: false },
         },
       ],
       defaultVariantKey: "default",
     },
-    behavior: {
-      dataType: "Item",
-      items: {
-        numberOfItems: 1,
-        allowLinks: false,
-      },
-    },
+    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: false,
-      hasBackground: false,
-    },
+    appearance: { isBordered: true, hasBackground: false },
   },
   {
     id: "io.supernova.block.title2",
-    name: "Title 2",
+    name: "Heading 2",
     description: "Section subheadings",
     category: "Text",
-    icon: "https://cdn-assets.supernova.io/blocks/icons/title-2.svg",
-    searchKeywords: ["heading", "h2"],
+    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: "Title 2",
-            richTextStyle: "Title2",
-          },
+          options: { placeholder: "Heading 2", richTextStyle: "Title2" },
         },
       ],
-      appearance: {
-        isBordered: false,
-        hasBackground: false,
-      },
+      appearance: { isBordered: true, hasBackground: false },
       variants: [
         {
           id: "default",
           name: "Default",
-          layout: {
-            type: "Column",
-            children: ["text"],
-            columnAlign: "Start",
-            columnResizing: "Fill",
-            gap: "Medium",
-          },
+          layout: { type: "Column", children: ["text"], columnAlign: "Start", columnResizing: "Fill", gap: "Medium" },
           maxColumns: 1,
           defaultColumns: 1,
-          appearance: {
-            isBordered: false,
-            hasBackground: false,
-            isEditorPresentationDifferent: false,
-          },
+          appearance: { isBordered: true, hasBackground: false, isEditorPresentationDifferent: false },
         },
       ],
       defaultVariantKey: "default",
     },
-    behavior: {
-      dataType: "Item",
-      items: {
-        numberOfItems: 1,
-        allowLinks: false,
-      },
-    },
+    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: false,
-      hasBackground: false,
-    },
+    appearance: { isBordered: true, hasBackground: false },
   },
   {
     id: "io.supernova.block.title3",
-    name: "Title 3",
+    name: "Heading 3",
     description: "Further subsections",
     category: "Text",
-    icon: "https://cdn-assets.supernova.io/blocks/icons/title-3.svg",
-    searchKeywords: ["heading", "h3"],
+    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: "Title 3",
-            richTextStyle: "Title3",
-          },
+          options: { placeholder: "Heading 3", richTextStyle: "Title3" },
         },
       ],
-      appearance: {
-        isBordered: false,
-        hasBackground: false,
-      },
+      appearance: { isBordered: true, hasBackground: false },
       variants: [
         {
           id: "default",
           name: "Default",
-          layout: {
-            type: "Column",
-            children: ["text"],
-            columnAlign: "Start",
-            columnResizing: "Fill",
-            gap: "Medium",
-          },
+          layout: { type: "Column", children: ["text"], columnAlign: "Start", columnResizing: "Fill", gap: "Medium" },
           maxColumns: 1,
           defaultColumns: 1,
-          appearance: {
-            isBordered: false,
-            hasBackground: false,
-            isEditorPresentationDifferent: false,
-          },
+          appearance: { isBordered: true, hasBackground: false, isEditorPresentationDifferent: false },
         },
       ],
       defaultVariantKey: "default",
     },
-    behavior: {
-      dataType: "Item",
-      items: {
-        numberOfItems: 1,
-        allowLinks: false,
-      },
-    },
+    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: false,
-      hasBackground: false,
-    },
+    appearance: { isBordered: true, hasBackground: false },
   },
   {
     id: "io.supernova.block.title4",
-    name: "Title 4",
+    name: "Heading 4",
     description: "Details in subsections",
     category: "Text",
-    icon: "https://cdn-assets.supernova.io/blocks/icons/title-4.svg",
-    searchKeywords: ["heading", "h4"],
+    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: "Title 4",
-            richTextStyle: "Title4",
-          },
+          options: { placeholder: "Heading 4", richTextStyle: "Title4" },
         },
       ],
-      appearance: {
-        isBordered: false,
-        hasBackground: false,
-      },
+      appearance: { isBordered: true, hasBackground: false },
       variants: [
         {
           id: "default",
           name: "Default",
-          layout: {
-            type: "Column",
-            children: ["text"],
-            columnAlign: "Start",
-            columnResizing: "Fill",
-            gap: "Medium",
-          },
+          layout: { type: "Column", children: ["text"], columnAlign: "Start", columnResizing: "Fill", gap: "Medium" },
           maxColumns: 1,
           defaultColumns: 1,
-          appearance: {
-            isBordered: false,
-            hasBackground: false,
-            isEditorPresentationDifferent: false,
-          },
+          appearance: { isBordered: true, hasBackground: false, isEditorPresentationDifferent: false },
         },
       ],
       defaultVariantKey: "default",
     },
-    behavior: {
-      dataType: "Item",
-      items: {
-        numberOfItems: 1,
-        allowLinks: false,
-      },
-    },
+    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: false,
-      hasBackground: false,
-    },
+    appearance: { isBordered: true, hasBackground: false },
   },
   {
     id: "io.supernova.block.title5",
-    name: "Title 5",
+    name: "Heading 5",
     description: "Nuanced details or sub-points",
     category: "Text",
-    icon: "https://cdn-assets.supernova.io/blocks/icons/title-5.svg",
-    searchKeywords: ["heading", "h5"],
+    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: "Title 5",
-            richTextStyle: "Title5",
-          },
+          options: { placeholder: "Heading 5", richTextStyle: "Title5" },
         },
       ],
-      appearance: {
-        isBordered: false,
-        hasBackground: false,
-      },
+      appearance: { isBordered: true, hasBackground: false },
       variants: [
         {
           id: "default",
           name: "Default",
-          layout: {
-            type: "Column",
-            children: ["text"],
-            columnAlign: "Start",
-            columnResizing: "Fill",
-            gap: "Medium",
-          },
+          layout: { type: "Column", children: ["text"], columnAlign: "Start", columnResizing: "Fill", gap: "Medium" },
           maxColumns: 1,
           defaultColumns: 1,
-          appearance: {
-            isBordered: false,
-            hasBackground: false,
-            isEditorPresentationDifferent: false,
-          },
+          appearance: { isBordered: true, hasBackground: false, isEditorPresentationDifferent: false },
         },
       ],
       defaultVariantKey: "default",
     },
-    behavior: {
-      dataType: "Item",
-      items: {
-        numberOfItems: 1,
-        allowLinks: false,
-      },
-    },
+    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: false,
-      hasBackground: false,
-    },
+    appearance: { isBordered: true, hasBackground: false },
   },
   {
     id: "io.supernova.block.ordered-list",
@@ -405,58 +256,34 @@ const blocks: PageBlockDefinition[] = [
           id: "text",
           name: "Text",
           type: "MultiRichText",
-          options: {
-            multiRichTextStyle: "OL",
-          },
+          options: { multiRichTextStyle: "OL" },
         },
       ],
-      appearance: {
-        isBordered: false,
-        hasBackground: false,
-      },
+      appearance: { isBordered: true, hasBackground: false },
       variants: [
         {
           id: "default",
           name: "Default",
-          layout: {
-            type: "Column",
-            children: ["text"],
-            columnAlign: "Start",
-            columnResizing: "Fill",
-            gap: "Medium",
-          },
+          layout: { type: "Column", children: ["text"], columnAlign: "Start", columnResizing: "Fill", gap: "Medium" },
           maxColumns: 1,
           defaultColumns: 1,
-          appearance: {
-            isBordered: false,
-            hasBackground: false,
-            isEditorPresentationDifferent: false,
-          },
+          appearance: { isBordered: true, hasBackground: false, isEditorPresentationDifferent: false },
         },
       ],
       defaultVariantKey: "default",
     },
-    behavior: {
-      dataType: "Item",
-      items: {
-        numberOfItems: 1,
-        allowLinks: false,
-      },
-    },
+    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: false,
-      hasBackground: false,
-    },
+    appearance: { isBordered: true, hasBackground: false },
   },
   {
     id: "io.supernova.block.unordered-list",
-    name: "Unordered list",
+    name: "Bullet list",
     description: "A list with bullet points",
     category: "Text",
     icon: "https://cdn-assets.supernova.io/blocks/icons/list-unordered.svg",
@@ -467,54 +294,30 @@ const blocks: PageBlockDefinition[] = [
           id: "text",
           name: "Text",
           type: "MultiRichText",
-          options: {
-            multiRichTextStyle: "UL",
-          },
+          options: { multiRichTextStyle: "UL" },
         },
       ],
-      appearance: {
-        isBordered: false,
-        hasBackground: false,
-      },
+      appearance: { isBordered: true, hasBackground: false },
       variants: [
         {
           id: "default",
           name: "Default",
-          layout: {
-            type: "Column",
-            children: ["text"],
-            columnAlign: "Start",
-            columnResizing: "Fill",
-            gap: "Medium",
-          },
+          layout: { type: "Column", children: ["text"], columnAlign: "Start", columnResizing: "Fill", gap: "Medium" },
           maxColumns: 1,
           defaultColumns: 1,
-          appearance: {
-            isBordered: false,
-            hasBackground: false,
-            isEditorPresentationDifferent: false,
-          },
+          appearance: { isBordered: true, hasBackground: false, isEditorPresentationDifferent: false },
         },
       ],
       defaultVariantKey: "default",
     },
-    behavior: {
-      dataType: "Item",
-      items: {
-        numberOfItems: 1,
-        allowLinks: false,
-      },
-    },
+    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: false,
-      hasBackground: false,
-    },
+    appearance: { isBordered: true, hasBackground: false },
   },
   {
     id: "io.supernova.block.divider",
@@ -524,18 +327,8 @@ const blocks: PageBlockDefinition[] = [
     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: false,
-        hasBackground: false,
-      },
+      properties: [{ id: "divider", name: "Divider", type: "Divider", options: {} }],
+      appearance: { isBordered: true, hasBackground: false },
       variants: [
         {
           id: "default",
@@ -549,102 +342,64 @@ const blocks: PageBlockDefinition[] = [
           },
           maxColumns: 1,
           defaultColumns: 1,
-          appearance: {
-            isBordered: false,
-            hasBackground: false,
-            isEditorPresentationDifferent: false,
-          },
+          appearance: { isBordered: true, hasBackground: false, isEditorPresentationDifferent: false },
         },
       ],
       defaultVariantKey: "default",
     },
-    behavior: {
-      dataType: "Item",
-      items: {
-        numberOfItems: 1,
-        allowLinks: false,
-      },
-    },
+    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: false,
-      hasBackground: false,
-    },
+    appearance: { isBordered: true, hasBackground: false },
   },
   {
     id: "io.supernova.block.blockquote",
-    name: "Blockquote",
+    name: "Quote",
     description: "Display a quotation",
     category: "Text",
     icon: "https://cdn-assets.supernova.io/blocks/icons/blockquote.svg",
-    searchKeywords: ["cite"],
+    searchKeywords: ["cite", "blockquote"],
     item: {
       properties: [
         {
           id: "text",
           name: "Text",
           type: "RichText",
-          options: {
-            placeholder: "Write a quote...",
-            richTextStyle: "Quote",
-          },
+          options: { placeholder: "Write a quote...", richTextStyle: "Quote" },
         },
       ],
-      appearance: {
-        isBordered: false,
-        hasBackground: false,
-      },
+      appearance: { isBordered: true, hasBackground: false },
       variants: [
         {
           id: "default",
           name: "Default",
-          layout: {
-            type: "Column",
-            children: ["text"],
-            columnAlign: "Start",
-            columnResizing: "Fill",
-            gap: "Medium",
-          },
+          layout: { type: "Column", children: ["text"], columnAlign: "Start", columnResizing: "Fill", gap: "Medium" },
           maxColumns: 1,
           defaultColumns: 1,
-          appearance: {
-            isBordered: false,
-            hasBackground: false,
-            isEditorPresentationDifferent: false,
-          },
+          appearance: { isBordered: true, hasBackground: false, isEditorPresentationDifferent: false },
         },
       ],
       defaultVariantKey: "default",
     },
-    behavior: {
-      dataType: "Item",
-      items: {
-        numberOfItems: 1,
-        allowLinks: false,
-      },
-    },
+    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: false,
-      hasBackground: false,
-    },
+    appearance: { isBordered: true, hasBackground: false },
   },
   {
     id: "io.supernova.block.callout",
     name: "Callout",
     description: "Highlight a section of text",
     category: "Text",
-    icon: "https://cdn-assets.supernova.io/blocks/icons/callout.svg",
+    icon: "https://cdn-assets.supernova.io/blocks/icons/v2/callout.svg",
     searchKeywords: ["banner", "alert", "note", "tip", "warning"],
     item: {
       properties: [
@@ -652,62 +407,37 @@ const blocks: PageBlockDefinition[] = [
           id: "text",
           name: "Text",
           type: "RichText",
-          options: {
-            placeholder: "Highlight some information...",
-            richTextStyle: "Callout",
-          },
+          options: { placeholder: "Highlight some information...", richTextStyle: "Callout" },
         },
       ],
-      appearance: {
-        isBordered: false,
-        hasBackground: false,
-      },
+      appearance: { isBordered: true, hasBackground: false },
       variants: [
         {
           id: "default",
           name: "Default",
-          layout: {
-            type: "Column",
-            children: ["text"],
-            columnAlign: "Start",
-            columnResizing: "Fill",
-            gap: "Medium",
-          },
+          layout: { type: "Column", children: ["text"], columnAlign: "Start", columnResizing: "Fill", gap: "Medium" },
           maxColumns: 1,
           defaultColumns: 1,
-          appearance: {
-            isBordered: false,
-            hasBackground: false,
-            isEditorPresentationDifferent: false,
-          },
+          appearance: { isBordered: true, hasBackground: false, isEditorPresentationDifferent: false },
         },
       ],
       defaultVariantKey: "default",
     },
-    behavior: {
-      dataType: "Item",
-      items: {
-        numberOfItems: 1,
-        allowLinks: false,
-      },
-    },
+    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: false,
-      hasBackground: false,
-    },
+    appearance: { isBordered: true, hasBackground: false },
   },
   {
     id: "io.supernova.block.image",
     name: "Image",
     description: "Display an image or Figma frame",
     category: "Media",
-    icon: "https://cdn-assets.supernova.io/blocks/icons/image.svg",
+    icon: "https://cdn-assets.supernova.io/blocks/icons/v2/image.svg",
     searchKeywords: ["image", "figma", "frame", "picture", "photo"],
     item: {
       properties: [
@@ -715,44 +445,23 @@ const blocks: PageBlockDefinition[] = [
           id: "image",
           name: "Image",
           type: "Image",
-          options: {
-            allowCaption: true,
-          },
+          options: { allowCaption: true },
         },
       ],
-      appearance: {
-        isBordered: false,
-        hasBackground: false,
-      },
+      appearance: { isBordered: true, hasBackground: false },
       variants: [
         {
           id: "default",
           name: "Default",
-          layout: {
-            type: "Column",
-            children: ["image"],
-            columnAlign: "Start",
-            columnResizing: "Fill",
-            gap: "Medium",
-          },
+          layout: { type: "Column", children: ["image"], columnAlign: "Start", columnResizing: "Fill", gap: "Medium" },
           maxColumns: 1,
           defaultColumns: 1,
-          appearance: {
-            isBordered: false,
-            hasBackground: false,
-            isEditorPresentationDifferent: false,
-          },
+          appearance: { isBordered: true, hasBackground: false, isEditorPresentationDifferent: false },
         },
       ],
       defaultVariantKey: "default",
     },
-    behavior: {
-      dataType: "Item",
-      items: {
-        numberOfItems: 1,
-        allowLinks: false,
-      },
-    },
+    behavior: { dataType: "Item", items: { numberOfItems: 1, allowLinks: false } },
     editorOptions: {
       onboarding: {
         helpText: "Use to display an image or Figma frame.",
@@ -760,66 +469,42 @@ const blocks: PageBlockDefinition[] = [
           "https://learn.supernova.io/latest/documentation/types-of-blocks/media-and-assets/image-Ue8VdT8B",
       },
     },
-    appearance: {
-      isBordered: false,
-      hasBackground: false,
-    },
+    appearance: { isBordered: false, hasBackground: 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/shortcuts.svg",
-    searchKeywords: [],
+    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,
-          },
+          options: { aspectRatio: "Landscape", allowCaption: false },
           variantOptions: {
-            iconOnTop: {
-              width: "Icon",
-              aspectRatio: "Square",
-            },
-            imageOnLeft: {
-              width: "Medium",
-            },
-            iconOnLeft: {
-              width: "Icon",
-              aspectRatio: "Square",
-            },
+            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",
-          },
+          options: { textStyle: "Title5", placeholder: "Add title" },
         },
         {
           id: "block.links.property.description",
           name: "Short description",
           type: "Text",
-          options: {
-            textStyle: "Default",
-            color: "NeutralFaded",
-            placeholder: "Add description",
-          },
+          options: { textStyle: "Default", color: "NeutralFaded", placeholder: "Add description" },
         },
       ],
-      appearance: {
-        isBordered: false,
-        hasBackground: false,
-      },
+      appearance: { isBordered: true, hasBackground: false },
       variants: [
         {
           id: "imageOnTop",
@@ -834,11 +519,7 @@ const blocks: PageBlockDefinition[] = [
           },
           maxColumns: 4,
           defaultColumns: 1,
-          appearance: {
-            isBordered: false,
-            hasBackground: false,
-            isEditorPresentationDifferent: false,
-          },
+          appearance: { isBordered: true, hasBackground: false, isEditorPresentationDifferent: false },
         },
         {
           id: "imageOnLeft",
@@ -868,11 +549,7 @@ const blocks: PageBlockDefinition[] = [
           },
           maxColumns: 1,
           defaultColumns: 1,
-          appearance: {
-            isBordered: false,
-            hasBackground: false,
-            isEditorPresentationDifferent: false,
-          },
+          appearance: { isBordered: true, hasBackground: false, isEditorPresentationDifferent: false },
         },
         {
           id: "iconOnTop",
@@ -887,11 +564,7 @@ const blocks: PageBlockDefinition[] = [
           },
           maxColumns: 4,
           defaultColumns: 1,
-          appearance: {
-            isBordered: false,
-            hasBackground: false,
-            isEditorPresentationDifferent: false,
-          },
+          appearance: { isBordered: true, hasBackground: false, isEditorPresentationDifferent: false },
         },
         {
           id: "iconOnLeft",
@@ -921,22 +594,12 @@ const blocks: PageBlockDefinition[] = [
           },
           maxColumns: 2,
           defaultColumns: 1,
-          appearance: {
-            isBordered: false,
-            hasBackground: false,
-            isEditorPresentationDifferent: false,
-          },
+          appearance: { isBordered: true, hasBackground: false, isEditorPresentationDifferent: false },
         },
       ],
       defaultVariantKey: "imageOnTop",
     },
-    behavior: {
-      dataType: "Item",
-      items: {
-        numberOfItems: -1,
-        allowLinks: true,
-      },
-    },
+    behavior: { dataType: "Item", items: { numberOfItems: -1, allowLinks: true } },
     editorOptions: {
       onboarding: {
         helpText: "Use link block to create single or multiple links to places in or out of your documentation.",
@@ -944,74 +607,7 @@ const blocks: PageBlockDefinition[] = [
           "https://learn.supernova.io/latest/documentation/types-of-blocks/links/shortcuts/general-jVfNifo4",
       },
     },
-    appearance: {
-      isBordered: false,
-      hasBackground: 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/token-a11y-contrast-grid.svg",
-    searchKeywords: ["color", "accessibility", "grid", "contrast", "blind", "impairment"],
-    item: {
-      properties: [
-        {
-          id: "tokens",
-          name: "Tokens",
-          type: "Token",
-          options: {
-            allowedTypes: ["Color"],
-            allowPropertySelection: false,
-            allowThemeSelection: false,
-          },
-        },
-      ],
-      appearance: {
-        isBordered: false,
-        hasBackground: false,
-      },
-      variants: [
-        {
-          id: "default",
-          name: "Default",
-          layout: {
-            type: "Column",
-            children: ["tokens"],
-            columnAlign: "Start",
-            columnResizing: "Fill",
-            gap: "Medium",
-          },
-          maxColumns: 1,
-          defaultColumns: 1,
-          appearance: {
-            isBordered: false,
-            hasBackground: false,
-            isEditorPresentationDifferent: false,
-          },
-        },
-      ],
-      defaultVariantKey: "default",
-    },
-    behavior: {
-      dataType: "Token",
-      entities: {
-        selectionType: "EntityAndGroup",
-        maxSelected: 0,
-      },
-    },
-    editorOptions: {
-      onboarding: {
-        helpText: "Visualize accessibility of your colors and compare token groups to one another.",
-        documentationLink: "https://learn.supernova.io",
-      },
-    },
-    appearance: {
-      isBordered: false,
-      hasBackground: false,
-    },
+    appearance: { isBordered: true, hasBackground: false },
   },
   {
     id: "io.supernova.block.embed",
@@ -1034,10 +630,7 @@ const blocks: PageBlockDefinition[] = [
           },
         },
       ],
-      appearance: {
-        isBordered: false,
-        hasBackground: false,
-      },
+      appearance: { isBordered: true, hasBackground: false },
       variants: [
         {
           id: "default",
@@ -1051,22 +644,12 @@ const blocks: PageBlockDefinition[] = [
           },
           maxColumns: 1,
           defaultColumns: 1,
-          appearance: {
-            isBordered: false,
-            hasBackground: false,
-            isEditorPresentationDifferent: false,
-          },
+          appearance: { isBordered: true, hasBackground: false, isEditorPresentationDifferent: false },
         },
       ],
       defaultVariantKey: "default",
     },
-    behavior: {
-      dataType: "Item",
-      items: {
-        numberOfItems: 1,
-        allowLinks: false,
-      },
-    },
+    behavior: { dataType: "Item", items: { numberOfItems: 1, allowLinks: false } },
     editorOptions: {
       onboarding: {
         helpText: "Embed any page to your documentation as an iframe.",
@@ -1074,10 +657,7 @@ const blocks: PageBlockDefinition[] = [
           "https://learn.supernova.io/latest/documentation/types-of-blocks/media-and-assets/embed/public-url-2ZeRQ332",
       },
     },
-    appearance: {
-      isBordered: false,
-      hasBackground: false,
-    },
+    appearance: { isBordered: true, hasBackground: false },
   },
   {
     id: "io.supernova.block.embed-youtube",
@@ -1100,39 +680,20 @@ const blocks: PageBlockDefinition[] = [
           },
         },
       ],
-      appearance: {
-        isBordered: false,
-        hasBackground: false,
-      },
+      appearance: { isBordered: true, hasBackground: false },
       variants: [
         {
           id: "default",
           name: "Default",
-          layout: {
-            type: "Column",
-            children: ["embed"],
-            columnAlign: "Start",
-            columnResizing: "Fill",
-            gap: "Medium",
-          },
+          layout: { type: "Column", children: ["embed"], columnAlign: "Start", columnResizing: "Fill", gap: "Medium" },
           maxColumns: 1,
           defaultColumns: 1,
-          appearance: {
-            isBordered: false,
-            hasBackground: false,
-            isEditorPresentationDifferent: false,
-          },
+          appearance: { isBordered: true, hasBackground: false, isEditorPresentationDifferent: false },
         },
       ],
       defaultVariantKey: "default",
     },
-    behavior: {
-      dataType: "Item",
-      items: {
-        numberOfItems: 1,
-        allowLinks: false,
-      },
-    },
+    behavior: { dataType: "Item", items: { numberOfItems: 1, allowLinks: false } },
     editorOptions: {
       onboarding: {
         helpText: "Embed a YouTube video to your documentation.",
@@ -1140,10 +701,7 @@ const blocks: PageBlockDefinition[] = [
           "https://learn.supernova.io/latest/documentation/types-of-blocks/media-and-assets/youtube-Gh8VUrSF",
       },
     },
-    appearance: {
-      isBordered: false,
-      hasBackground: false,
-    },
+    appearance: { isBordered: true, hasBackground: false },
   },
   {
     id: "io.supernova.block.embed-lottie",
@@ -1158,55 +716,41 @@ const blocks: PageBlockDefinition[] = [
           id: "url",
           name: "Lottie URL",
           type: "URL",
-          options: {
-            urlValidationRegex: "^(http|https)://.*.(json|lottie)$",
-          },
+          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,
-          },
+          options: { defaultValue: 270 },
         },
         {
           id: "width",
           name: "Width",
           type: "Number",
-          options: {
-            defaultValue: 400,
-          },
+          options: { defaultValue: 400 },
         },
         {
           id: "autoplay",
           name: "Autoplay",
           type: "Boolean",
-          options: {
-            defaultValue: true,
-          },
+          options: { defaultValue: true },
         },
         {
           id: "loop",
           name: "Loop",
           type: "Boolean",
-          options: {
-            defaultValue: true,
-          },
+          options: { defaultValue: true },
         },
         {
           id: "playerControls",
           name: "Show player controls",
           type: "Boolean",
-          options: {
-            defaultValue: true,
-          },
+          options: { defaultValue: true },
         },
       ],
-      appearance: {
-        isBordered: false,
-        hasBackground: false,
-      },
+      appearance: { isBordered: true, hasBackground: false },
       variants: [
         {
           id: "default",
@@ -1221,22 +765,12 @@ const blocks: PageBlockDefinition[] = [
           },
           maxColumns: 1,
           defaultColumns: 1,
-          appearance: {
-            isBordered: false,
-            hasBackground: false,
-            isEditorPresentationDifferent: true,
-          },
+          appearance: { isBordered: true, hasBackground: false, isEditorPresentationDifferent: true },
         },
       ],
       defaultVariantKey: "default",
     },
-    behavior: {
-      dataType: "Item",
-      items: {
-        numberOfItems: 1,
-        allowLinks: false,
-      },
-    },
+    behavior: { dataType: "Item", items: { numberOfItems: 1, allowLinks: false } },
     editorOptions: {
       onboarding: {
         helpText: "Embed a Lottie animation to your documentation.",
@@ -1244,10 +778,7 @@ const blocks: PageBlockDefinition[] = [
           "https://learn.supernova.io/latest/documentation/types-of-blocks/media-and-assets/lottie-preview-7CqFdGv9",
       },
     },
-    appearance: {
-      isBordered: false,
-      hasBackground: false,
-    },
+    appearance: { isBordered: true, hasBackground: false },
   },
   {
     id: "io.supernova.block.storybook",
@@ -1262,56 +793,30 @@ const blocks: PageBlockDefinition[] = [
           id: "embed",
           name: "Storybook URL",
           type: "Storybook",
-          options: {
-            allowCaption: true,
-            allowResize: true,
-            defaultHeight: 400,
-          },
+          options: { allowCaption: true, allowResize: true, defaultHeight: 400 },
         },
       ],
-      appearance: {
-        isBordered: false,
-        hasBackground: false,
-      },
+      appearance: { isBordered: true, hasBackground: false },
       variants: [
         {
           id: "default",
           name: "Default",
-          layout: {
-            type: "Column",
-            children: ["embed"],
-            columnAlign: "Start",
-            columnResizing: "Fill",
-            gap: "Medium",
-          },
+          layout: { type: "Column", children: ["embed"], columnAlign: "Start", columnResizing: "Fill", gap: "Medium" },
           maxColumns: 1,
           defaultColumns: 1,
-          appearance: {
-            isBordered: false,
-            hasBackground: false,
-            isEditorPresentationDifferent: false,
-          },
+          appearance: { isBordered: true, hasBackground: false, isEditorPresentationDifferent: false },
         },
       ],
       defaultVariantKey: "default",
     },
-    behavior: {
-      dataType: "Item",
-      items: {
-        numberOfItems: 1,
-        allowLinks: false,
-      },
-    },
+    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: false,
-      hasBackground: false,
-    },
+    appearance: { isBordered: true, hasBackground: false },
   },
   {
     id: "io.supernova.block.embed-figma",
@@ -1334,49 +839,27 @@ const blocks: PageBlockDefinition[] = [
           },
         },
       ],
-      appearance: {
-        isBordered: false,
-        hasBackground: false,
-      },
+      appearance: { isBordered: true, hasBackground: false },
       variants: [
         {
           id: "default",
           name: "Default",
-          layout: {
-            type: "Column",
-            children: ["embed"],
-            columnAlign: "Start",
-            columnResizing: "Fill",
-            gap: "Medium",
-          },
+          layout: { type: "Column", children: ["embed"], columnAlign: "Start", columnResizing: "Fill", gap: "Medium" },
           maxColumns: 1,
           defaultColumns: 1,
-          appearance: {
-            isBordered: false,
-            hasBackground: false,
-            isEditorPresentationDifferent: false,
-          },
+          appearance: { isBordered: true, hasBackground: false, isEditorPresentationDifferent: false },
         },
       ],
       defaultVariantKey: "default",
     },
-    behavior: {
-      dataType: "Item",
-      items: {
-        numberOfItems: 1,
-        allowLinks: false,
-      },
-    },
+    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: false,
-      hasBackground: false,
-    },
+    appearance: { isBordered: true, hasBackground: false },
   },
   {
     id: "io.supernova.block.markdown",
@@ -1384,22 +867,17 @@ const blocks: PageBlockDefinition[] = [
     description: "Render Markdown URL",
     category: "Other",
     icon: "https://cdn-assets.supernova.io/blocks/icons/markdown.svg",
-    searchKeywords: ["md", "embed", "api", "table", "mdx"],
+    searchKeywords: ["md", "embed", "api", "props", "mdx"],
     item: {
       properties: [
         {
           id: "markdownUrl",
           name: "Markdown URL",
           type: "Markdown",
-          options: {
-            urlValidationRegex: "^(https?://)?(www.)?.+.md$",
-          },
+          options: { urlValidationRegex: "^(https?://)?(www\\.)?.+\\.md(\\?.*)?$" },
         },
       ],
-      appearance: {
-        isBordered: false,
-        hasBackground: false,
-      },
+      appearance: { isBordered: true, hasBackground: false },
       variants: [
         {
           id: "plain",
@@ -1414,11 +892,7 @@ const blocks: PageBlockDefinition[] = [
           },
           maxColumns: 1,
           defaultColumns: 1,
-          appearance: {
-            isBordered: false,
-            hasBackground: false,
-            isEditorPresentationDifferent: true,
-          },
+          appearance: { isBordered: true, hasBackground: false, isEditorPresentationDifferent: true },
         },
         {
           id: "bordered",
@@ -1433,11 +907,7 @@ const blocks: PageBlockDefinition[] = [
           },
           maxColumns: 1,
           defaultColumns: 1,
-          appearance: {
-            isBordered: false,
-            hasBackground: false,
-            isEditorPresentationDifferent: true,
-          },
+          appearance: { isBordered: true, hasBackground: false, isEditorPresentationDifferent: true },
         },
         {
           id: "boxed",
@@ -1452,416 +922,188 @@ const blocks: PageBlockDefinition[] = [
           },
           maxColumns: 1,
           defaultColumns: 1,
-          appearance: {
-            isBordered: false,
-            hasBackground: false,
-            isEditorPresentationDifferent: true,
-          },
+          appearance: { isBordered: true, hasBackground: false, isEditorPresentationDifferent: true },
         },
       ],
       defaultVariantKey: "plain",
     },
-    behavior: {
-      dataType: "Item",
-      items: {
-        numberOfItems: 1,
-        allowLinks: false,
-      },
-    },
+    behavior: { dataType: "Item", items: { numberOfItems: 1, allowLinks: false } },
     editorOptions: {
       onboarding: {
-        helpText: "Embed and process markdown from URL.",
+        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: false,
-      hasBackground: false,
-    },
+    appearance: { isBordered: true, hasBackground: false },
   },
   {
     id: "io.supernova.block.table",
     name: "Table",
     description: "Display a simple table",
     category: "Layout",
-    icon: "https://cdn-assets.supernova.io/blocks/icons/table.svg",
+    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: false,
-        hasBackground: false,
-      },
+      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",
-          },
+          layout: { type: "Column", children: ["table"], columnAlign: "Start", columnResizing: "Fill", gap: "Medium" },
           maxColumns: 1,
           defaultColumns: 1,
-          appearance: {
-            isBordered: false,
-            hasBackground: false,
-            isEditorPresentationDifferent: false,
-          },
+          appearance: { isBordered: true, hasBackground: false, isEditorPresentationDifferent: false },
         },
       ],
       defaultVariantKey: "default",
     },
-    behavior: {
-      dataType: "Item",
-      items: {
-        numberOfItems: 1,
-        allowLinks: false,
-      },
-    },
+    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: false,
-      hasBackground: false,
-    },
+    appearance: { isBordered: true, hasBackground: false },
   },
   {
-    id: "io.supernova.block.token-detail",
-    name: "Token detail",
-    description: "Show a single design tokens",
+    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/token-detail.svg",
-    searchKeywords: ["color", "typography", "spacing", "grid", "material", "theme"],
+    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",
-          },
+          options: { renderLayoutAs: "List", defaultTheme: "none", defaultValuePreview: "Split" },
+          variantOptions: { grid: { renderLayoutAs: "Grid" } },
         },
       ],
-      appearance: {
-        isBordered: false,
-        hasBackground: false,
-      },
+      appearance: { isBordered: true, hasBackground: false },
       variants: [
         {
           id: "table",
-          name: "Table row",
+          name: "Table",
           image: "https://cdn-assets.supernova.io/blocks/variants/tokens-table.svg",
-          layout: {
-            type: "Column",
-            children: ["tokens"],
-            columnAlign: "Start",
-            columnResizing: "Fill",
-            gap: "Medium",
-          },
+          layout: { type: "Column", children: ["tokens"], columnAlign: "Start", columnResizing: "Fill", gap: "Medium" },
           maxColumns: 1,
           defaultColumns: 1,
-          appearance: {
-            isBordered: false,
-            hasBackground: false,
-            isEditorPresentationDifferent: false,
-          },
+          appearance: { isBordered: true, hasBackground: false, isEditorPresentationDifferent: false },
         },
         {
           id: "grid",
-          name: "Grid item",
+          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: 1,
-          defaultColumns: 1,
-          appearance: {
-            isBordered: false,
-            hasBackground: false,
-            isEditorPresentationDifferent: false,
-          },
-        },
-        {
-          id: "color-stack",
-          name: "Color stack item",
-          image: "https://cdn-assets.supernova.io/blocks/variants/tokens-color-stack.svg",
-          layout: {
-            type: "Column",
-            children: ["tokens"],
-            columnAlign: "Start",
-            columnResizing: "Fill",
-            gap: "Medium",
-          },
-          maxColumns: 1,
+          layout: { type: "Column", children: ["tokens"], columnAlign: "Start", columnResizing: "Fill", gap: "Medium" },
+          maxColumns: 4,
           defaultColumns: 1,
-          appearance: {
-            isBordered: false,
-            hasBackground: false,
-            isEditorPresentationDifferent: false,
-          },
+          appearance: { isBordered: true, hasBackground: false, isEditorPresentationDifferent: false },
         },
       ],
       defaultVariantKey: "table",
     },
-    behavior: {
-      dataType: "Token",
-      entities: {
-        selectionType: "Entity",
-        maxSelected: 1,
-      },
-    },
+    behavior: { dataType: "Token", entities: { selectionType: "EntityAndGroup", maxSelected: 0 } },
     editorOptions: {
       onboarding: {
-        helpText: "Show a single design token.",
+        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-detail-04",
+          "https://learn.supernova.io/latest/documentation/types-of-blocks/token/tokens/general-84NRgxGl#section-token-group-09",
       },
     },
-    appearance: {
-      isBordered: false,
-      hasBackground: false,
-    },
+    appearance: { isBordered: true, hasBackground: false },
   },
   {
-    id: "io.supernova.block.token-list",
-    name: "Token list",
-    description: "Show a list of design tokens",
+    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/token-list.svg",
-    searchKeywords: ["color", "typography", "spacing", "grid", "material", "theme"],
+    searchKeywords: ["tokens", "ramp", "shades", "palette", "spectrum", "stack", "range", "swatch"],
     item: {
       properties: [
         {
           id: "tokens",
           name: "Tokens",
           type: "Token",
-          options: {
-            renderLayoutAs: "List",
-            defaultTheme: "none",
-            defaultValuePreview: "Split",
-          },
-          variantOptions: {
-            grid: {
-              renderLayoutAs: "Grid",
-            },
-          },
+          options: { allowedTypes: ["Color"], allowPropertySelection: false, allowThemeSelection: true },
         },
       ],
-      appearance: {
-        isBordered: false,
-        hasBackground: false,
-      },
+      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: {
-            isBordered: false,
-            hasBackground: false,
-            isEditorPresentationDifferent: false,
-          },
-        },
-        {
-          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: {
-            isBordered: false,
-            hasBackground: false,
-            isEditorPresentationDifferent: false,
-          },
-        },
-        {
-          id: "color-stack",
-          name: "Color stack",
+          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: 1,
+          layout: { type: "Column", children: ["tokens"], columnAlign: "Start", columnResizing: "Fill", gap: "Medium" },
+          maxColumns: 2,
           defaultColumns: 1,
-          appearance: {
-            isBordered: false,
-            hasBackground: false,
-            isEditorPresentationDifferent: false,
-          },
+          appearance: { isBordered: true, hasBackground: false, isEditorPresentationDifferent: true },
         },
       ],
-      defaultVariantKey: "table",
-    },
-    behavior: {
-      dataType: "Token",
-      entities: {
-        selectionType: "Entity",
-        maxSelected: 0,
-      },
+      defaultVariantKey: "default",
     },
+    behavior: { dataType: "Token", entities: { selectionType: "EntityAndGroup", maxSelected: 0 } },
     editorOptions: {
-      onboarding: {
-        helpText:
-          "Show a list of design tokens. You can use this block to create a list of colors, typography, spacing, grid, or any other token type.",
-        documentationLink:
-          "https://learn.supernova.io/latest/documentation/types-of-blocks/token/tokens/general-84NRgxGl#section-token-list-06",
-      },
-    },
-    appearance: {
-      isBordered: false,
-      hasBackground: false,
+      onboarding: { helpText: "The best way to display colors", documentationLink: "https://learn.supernova.io" },
     },
+    appearance: { isBordered: true, hasBackground: false },
   },
   {
-    id: "io.supernova.block.token-group",
-    name: "Token group",
-    description: "Show a group of design tokens",
+    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/token-list.svg",
-    searchKeywords: ["color", "typography", "spacing", "grid", "material", "theme"],
+    icon: "https://cdn-assets.supernova.io/blocks/icons/token-accessibility-grid.svg",
+    searchKeywords: ["tokens", "color", "accessibility", "grid", "contrast"],
     item: {
       properties: [
         {
           id: "tokens",
           name: "Tokens",
           type: "Token",
-          options: {
-            renderLayoutAs: "List",
-            defaultTheme: "none",
-            defaultValuePreview: "Split",
-          },
-          variantOptions: {
-            grid: {
-              renderLayoutAs: "Grid",
-            },
-          },
+          options: { allowedTypes: ["Color"], allowPropertySelection: false, allowThemeSelection: false },
         },
       ],
-      appearance: {
-        isBordered: false,
-        hasBackground: false,
-      },
+      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",
-          },
+          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: {
-            isBordered: false,
-            hasBackground: false,
-            isEditorPresentationDifferent: false,
-          },
-        },
-        {
-          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: {
-            isBordered: false,
-            hasBackground: false,
-            isEditorPresentationDifferent: false,
-          },
-        },
-        {
-          id: "color-stack",
-          name: "Color stack",
-          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: {
-            isBordered: false,
-            hasBackground: false,
-            isEditorPresentationDifferent: false,
-          },
+          appearance: { isBordered: true, hasBackground: false, isEditorPresentationDifferent: true },
         },
       ],
-      defaultVariantKey: "table",
-    },
-    behavior: {
-      dataType: "Token",
-      entities: {
-        selectionType: "Group",
-        maxSelected: 1,
-      },
+      defaultVariantKey: "default",
     },
+    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",
+        helpText: "Visualize accessibility of your colors by automatically calculating their color contrast ratio.",
+        documentationLink: "https://learn.supernova.io",
       },
     },
-    appearance: {
-      isBordered: false,
-      hasBackground: false,
-    },
+    appearance: { isBordered: true, hasBackground: false },
   },
   {
     id: "io.supernova.block.code",
@@ -1871,181 +1113,91 @@ const blocks: PageBlockDefinition[] = [
     icon: "https://cdn-assets.supernova.io/blocks/icons/code.svg",
     searchKeywords: ["code"],
     item: {
-      properties: [
-        {
-          id: "code",
-          name: "Code",
-          type: "Code",
-          options: {},
-        },
-      ],
-      appearance: {
-        isBordered: false,
-        hasBackground: false,
-      },
+      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",
-          },
+          layout: { type: "Column", children: ["code"], columnAlign: "Start", columnResizing: "Fill", gap: "Medium" },
           maxColumns: 1,
           defaultColumns: 1,
-          appearance: {
-            isBordered: false,
-            hasBackground: false,
-            isEditorPresentationDifferent: false,
-          },
+          appearance: { isBordered: true, hasBackground: false, isEditorPresentationDifferent: false },
         },
       ],
       defaultVariantKey: "default",
     },
-    behavior: {
-      dataType: "Item",
-      items: {
-        numberOfItems: 1,
-        allowLinks: false,
-      },
-    },
-    editorOptions: {
-      onboarding: {
-        helpText: "Code descriptor.",
-      },
-    },
-    appearance: {
-      isBordered: false,
-      hasBackground: false,
-    },
+    behavior: { dataType: "Item", items: { numberOfItems: 1, allowLinks: false } },
+    editorOptions: { onboarding: { helpText: "Code descriptor." } },
+    appearance: { isBordered: true, hasBackground: false },
   },
   {
     id: "io.supernova.block.code-react",
     name: "React code",
-    description: "Render React code",
+    description: "Render a code snippet",
     category: "Code",
-    icon: "https://cdn-assets.supernova.io/blocks/icons/code-react.svg",
-    searchKeywords: ["code", "react", "snippet", "storybook", "editor", "example"],
+    icon: "https://cdn-assets.supernova.io/blocks/icons/v2/code-react.svg",
+    searchKeywords: ["code", "react", "snippet", "storybook", "editor", "example", "sandbox"],
     item: {
       properties: [
         {
           id: "code",
           name: "Code",
           type: "CodeSandbox",
-          options: {
-            renderLayoutAs: "PreviewOnTop",
-          },
+          options: { renderLayoutAs: "PreviewOnTop" },
           variantOptions: {
-            codeTop: {
-              renderLayoutAs: "PreviewOnBottom",
-            },
-            codeLeft: {
-              renderLayoutAs: "PreviewOnRight",
-            },
-            codeRight: {
-              renderLayoutAs: "PreviewOnLeft",
-            },
+            codeTop: { renderLayoutAs: "PreviewOnBottom" },
+            codeLeft: { renderLayoutAs: "PreviewOnRight" },
+            codeRight: { renderLayoutAs: "PreviewOnLeft" },
           },
         },
       ],
-      appearance: {
-        isBordered: false,
-        hasBackground: false,
-      },
+      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",
-          },
+          layout: { type: "Column", children: ["code"], columnAlign: "Start", columnResizing: "Fill", gap: "Medium" },
           maxColumns: 1,
           defaultColumns: 1,
-          appearance: {
-            isBordered: false,
-            hasBackground: false,
-            isEditorPresentationDifferent: false,
-          },
+          appearance: { isBordered: true, hasBackground: false, isEditorPresentationDifferent: false },
         },
         {
           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",
-          },
+          layout: { type: "Column", children: ["code"], columnAlign: "Start", columnResizing: "Fill", gap: "Medium" },
           maxColumns: 1,
           defaultColumns: 1,
-          appearance: {
-            isBordered: false,
-            hasBackground: false,
-            isEditorPresentationDifferent: false,
-          },
+          appearance: { isBordered: true, hasBackground: false, isEditorPresentationDifferent: false },
         },
         {
           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",
-          },
+          layout: { type: "Column", children: ["code"], columnAlign: "Start", columnResizing: "Fill", gap: "Medium" },
           maxColumns: 1,
           defaultColumns: 1,
-          appearance: {
-            isBordered: false,
-            hasBackground: false,
-            isEditorPresentationDifferent: false,
-          },
+          appearance: { isBordered: true, hasBackground: false, isEditorPresentationDifferent: false },
         },
         {
           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",
-          },
+          layout: { type: "Column", children: ["code"], columnAlign: "Start", columnResizing: "Fill", gap: "Medium" },
           maxColumns: 1,
           defaultColumns: 1,
-          appearance: {
-            isBordered: false,
-            hasBackground: false,
-            isEditorPresentationDifferent: false,
-          },
+          appearance: { isBordered: true, hasBackground: false, isEditorPresentationDifferent: false },
         },
       ],
       defaultVariantKey: "codeBottom",
     },
-    behavior: {
-      dataType: "Item",
-      items: {
-        numberOfItems: 1,
-        allowLinks: false,
-      },
-    },
+    behavior: { dataType: "Item", items: { numberOfItems: 1, allowLinks: false } },
     editorOptions: {
       onboarding: {
         helpText: "Display rendered code example",
@@ -2053,160 +1205,53 @@ const blocks: PageBlockDefinition[] = [
           "https://learn.supernova.io/latest/documentation/types-of-blocks/code/render-react-code-vxufnkFm",
       },
     },
-    appearance: {
-      isBordered: false,
-      hasBackground: false,
-    },
-  },
-  {
-    id: "io.supernova.block.link",
-    name: "Link",
-    description: "Preview of a link",
-    category: "Media",
-    icon: "https://cdn-assets.supernova.io/blocks/icons/shortcut-link.svg",
-    searchKeywords: [],
-    item: {
-      properties: [
-        {
-          id: "block.links.property.url",
-          name: "URL",
-          type: "EmbedURL",
-          options: {
-            defaultHeight: 120,
-            allowResize: false,
-          },
-        },
-      ],
-      appearance: {
-        isBordered: false,
-        hasBackground: false,
-      },
-      variants: [
-        {
-          id: "default",
-          name: "Default",
-          layout: {
-            type: "Column",
-            children: ["block.links.property.url"],
-            columnAlign: "Start",
-            columnResizing: "Fill",
-            gap: "Medium",
-          },
-          maxColumns: 1,
-          defaultColumns: 1,
-          appearance: {
-            isBordered: false,
-            hasBackground: false,
-            isEditorPresentationDifferent: false,
-          },
-        },
-      ],
-      defaultVariantKey: "default",
-    },
-    behavior: {
-      dataType: "Item",
-      items: {
-        numberOfItems: 1,
-        allowLinks: false,
-      },
-    },
-    editorOptions: {},
-    appearance: {
-      isBordered: false,
-      hasBackground: false,
-    },
+    appearance: { isBordered: false, hasBackground: false },
   },
   {
     id: "io.supernova.block.assets",
     name: "Assets",
     description: "Display icons or illustrations",
     category: "Assets",
-    icon: "https://cdn-assets.supernova.io/blocks/icons/assets.svg",
-    searchKeywords: ["icons", "illustrations", "grid", "svg", "logos", "theme"],
+    icon: "https://cdn-assets.supernova.io/blocks/icons/v2/assets.svg",
+    searchKeywords: ["icons", "illustrations", "grid", "svg", "logos"],
     item: {
-      properties: [
-        {
-          id: "assets",
-          name: "Assets",
-          type: "Asset",
-          options: {},
-        },
-      ],
-      appearance: {
-        isBordered: false,
-        hasBackground: false,
-      },
+      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 of assets. Both the title and description are displayed below the preview.",
-          layout: {
-            type: "Column",
-            children: ["assets"],
-            columnAlign: "Start",
-            columnResizing: "Fill",
-            gap: "Medium",
-          },
-          maxColumns: 1,
+          layout: { type: "Column", children: ["assets"], columnAlign: "Start", columnResizing: "Fill", gap: "Medium" },
+          maxColumns: 8,
           defaultColumns: 1,
-          appearance: {
-            isBordered: false,
-            hasBackground: false,
-            isEditorPresentationDifferent: false,
-          },
+          appearance: { isBordered: true, hasBackground: false, isEditorPresentationDifferent: false },
         },
         {
           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. Only the title is displayed.",
-          layout: {
-            type: "Column",
-            children: ["assets"],
-            columnAlign: "Start",
-            columnResizing: "Fill",
-            gap: "Medium",
-          },
-          maxColumns: 1,
+          layout: { type: "Column", children: ["assets"], columnAlign: "Start", columnResizing: "Fill", gap: "Medium" },
+          maxColumns: 8,
           defaultColumns: 1,
-          appearance: {
-            isBordered: false,
-            hasBackground: false,
-            isEditorPresentationDifferent: false,
-          },
+          appearance: { isBordered: true, hasBackground: false, isEditorPresentationDifferent: false },
         },
         {
           id: "borderless-grid",
           name: "Borderless grid",
           image: "https://cdn-assets.supernova.io/blocks/variants/assets-borderless-grid.svg",
           description: "Borderless grid, perfect for displaying assets of the same height. Only the title is visible.",
-          layout: {
-            type: "Column",
-            children: ["assets"],
-            columnAlign: "Start",
-            columnResizing: "Fill",
-            gap: "Medium",
-          },
-          maxColumns: 1,
+          layout: { type: "Column", children: ["assets"], columnAlign: "Start", columnResizing: "Fill", gap: "Medium" },
+          maxColumns: 8,
           defaultColumns: 1,
-          appearance: {
-            isBordered: false,
-            hasBackground: false,
-            isEditorPresentationDifferent: false,
-          },
+          appearance: { isBordered: true, hasBackground: false, isEditorPresentationDifferent: false },
         },
       ],
       defaultVariantKey: "default",
     },
-    behavior: {
-      dataType: "Asset",
-      entities: {
-        selectionType: "EntityAndGroup",
-        maxSelected: 0,
-      },
-    },
+    behavior: { dataType: "Asset", entities: { selectionType: "EntityAndGroup", maxSelected: 0 } },
     editorOptions: {
       onboarding: {
         helpText: "Display a grid of icons or illustrations.",
@@ -2214,17 +1259,14 @@ const blocks: PageBlockDefinition[] = [
           "https://learn.supernova.io/latest/documentation/types-of-blocks/media-and-assets/asset/general-xa6EgXb2",
       },
     },
-    appearance: {
-      isBordered: false,
-      hasBackground: false,
-    },
+    appearance: { isBordered: true, hasBackground: false },
   },
   {
     id: "io.supernova.block.figma-frames",
     name: "Figma frames",
     description: "Display Figma frames as images",
     category: "Figma",
-    icon: "https://cdn-assets.supernova.io/blocks/icons/figma-frames.svg",
+    icon: "https://cdn-assets.supernova.io/blocks/icons/v2/figma-frames.svg",
     searchKeywords: ["figma", "frames", "image"],
     item: {
       properties: [
@@ -2235,10 +1277,7 @@ const blocks: PageBlockDefinition[] = [
           options: {},
         },
       ],
-      appearance: {
-        isBordered: false,
-        hasBackground: false,
-      },
+      appearance: { isBordered: true, hasBackground: false },
       variants: [
         {
           id: "bordered",
@@ -2254,11 +1293,7 @@ const blocks: PageBlockDefinition[] = [
           },
           maxColumns: 1,
           defaultColumns: 1,
-          appearance: {
-            isBordered: false,
-            hasBackground: false,
-            isEditorPresentationDifferent: false,
-          },
+          appearance: { isBordered: true, hasBackground: false, isEditorPresentationDifferent: false },
         },
         {
           id: "plain",
@@ -2274,22 +1309,12 @@ const blocks: PageBlockDefinition[] = [
           },
           maxColumns: 1,
           defaultColumns: 1,
-          appearance: {
-            isBordered: false,
-            hasBackground: false,
-            isEditorPresentationDifferent: false,
-          },
+          appearance: { isBordered: true, hasBackground: false, isEditorPresentationDifferent: false },
         },
       ],
       defaultVariantKey: "bordered",
     },
-    behavior: {
-      dataType: "FigmaNode",
-      entities: {
-        selectionType: "Entity",
-        maxSelected: 0,
-      },
-    },
+    behavior: { dataType: "FigmaNode", entities: { selectionType: "Entity", maxSelected: 0 } },
     editorOptions: {
       onboarding: {
         helpText: "Display Figma frames as images.",
@@ -2297,10 +1322,7 @@ const blocks: PageBlockDefinition[] = [
           "https://learn.supernova.io/latest/documentation/types-of-blocks/figma/figma-frames/general-f3IYC5dg",
       },
     },
-    appearance: {
-      isBordered: false,
-      hasBackground: false,
-    },
+    appearance: { isBordered: true, hasBackground: false },
   },
   {
     id: "io.supernova.block.release-notes",
@@ -2311,54 +1333,32 @@ const blocks: PageBlockDefinition[] = [
     searchKeywords: ["version", "changelog", "history"],
     item: {
       properties: [],
-      appearance: {
-        isBordered: false,
-        hasBackground: false,
-      },
+      appearance: { isBordered: true, hasBackground: false },
       variants: [
         {
           id: "default",
           name: "Default",
           image: "https://cdn-assets.supernova.io/blocks/variants/release-notes.svg",
-          layout: {
-            type: "Column",
-            children: [],
-            columnAlign: "Start",
-            columnResizing: "Fill",
-            gap: "Medium",
-          },
+          layout: { type: "Column", children: [], columnAlign: "Start", columnResizing: "Fill", gap: "Medium" },
           maxColumns: 1,
           defaultColumns: 1,
-          appearance: {
-            isBordered: false,
-            hasBackground: false,
-            isEditorPresentationDifferent: true,
-          },
+          appearance: { isBordered: true, hasBackground: false, isEditorPresentationDifferent: true },
         },
       ],
       defaultVariantKey: "default",
     },
-    behavior: {
-      dataType: "Item",
-      items: {
-        numberOfItems: 1,
-        allowLinks: false,
-      },
-    },
+    behavior: { dataType: "Item", items: { numberOfItems: 1, allowLinks: false } },
     editorOptions: {
       onboarding: {
-        helpText: "Show formatted release notes from all previous released versions",
+        helpText: "Show formatted release notes from all previous released versions.",
       },
     },
-    appearance: {
-      isBordered: false,
-      hasBackground: false,
-    },
+    appearance: { isBordered: true, hasBackground: false },
   },
   {
     id: "io.supernova.block.component-checklist",
     name: "Component checklist",
-    description: "Highlight specific features of your components",
+    description: "Highlight specific component properties",
     category: "Components",
     icon: "https://cdn-assets.supernova.io/blocks/icons/component-checklist.svg",
     searchKeywords: ["components", "health", "properties", "overview", "status"],
@@ -2368,31 +1368,22 @@ const blocks: PageBlockDefinition[] = [
           id: "components",
           name: "Components",
           type: "Component",
-          options: {
-            renderLayoutAs: "List",
-          },
-        },
-        {
-          id: "showDescription",
-          name: "Show description",
-          type: "Boolean",
-          options: {
-            defaultValue: true,
-          },
+          options: { renderLayoutAs: "List" },
         },
         {
           id: "title",
           name: "Title",
           type: "Text",
-          options: {
-            defaultValue: "Component checklist",
-          },
+          options: { defaultValue: "Component checklist" },
+        },
+        {
+          id: "showDescription",
+          name: "Show description",
+          type: "Boolean",
+          options: { defaultValue: true },
         },
       ],
-      appearance: {
-        isBordered: false,
-        hasBackground: false,
-      },
+      appearance: { isBordered: true, hasBackground: false },
       variants: [
         {
           id: "default",
@@ -2400,71 +1391,51 @@ const blocks: PageBlockDefinition[] = [
           image: "https://cdn-assets.supernova.io/blocks/variants/component-checklist.svg",
           layout: {
             type: "Column",
-            children: ["components", "showDescription", "title"],
+            children: ["components", "showDescription"],
             columnAlign: "Start",
             columnResizing: "Fill",
             gap: "Medium",
           },
           maxColumns: 1,
           defaultColumns: 1,
-          appearance: {
-            isBordered: false,
-            hasBackground: false,
-            isEditorPresentationDifferent: true,
-          },
+          appearance: { isBordered: true, hasBackground: false, isEditorPresentationDifferent: true },
         },
       ],
       defaultVariantKey: "default",
     },
-    behavior: {
-      dataType: "Component",
-      entities: {
-        selectionType: "Entity",
-        maxSelected: 1,
-      },
-    },
+    behavior: { dataType: "Component", entities: { selectionType: "Entity", maxSelected: 1 } },
     editorOptions: {
       onboarding: {
-        helpText: "Highlight specific features of your components.",
+        helpText: "Highlight specific component properties",
         documentationLink:
           "https://learn.supernova.io/latest/documentation/types-of-blocks/component/component-checklist-NXepPIpZ",
       },
     },
-    appearance: {
-      isBordered: false,
-      hasBackground: false,
-    },
+    appearance: { isBordered: true, hasBackground: false },
   },
   {
     id: "io.supernova.block.component-checklist-all",
     name: "Component overview table",
-    description: "Show the overview of all your components",
+    description: "Show an overview of all components",
     category: "Components",
-    icon: "https://cdn-assets.supernova.io/blocks/icons/component-overview-table.svg",
-    searchKeywords: ["components", "health", "properties", "overview", "status"],
+    icon: "https://cdn-assets.supernova.io/blocks/icons/v2/component-checklist-all.svg",
+    searchKeywords: ["components", "health", "overview", "status"],
     item: {
       properties: [
         {
           id: "components",
           name: "Components",
           type: "Component",
-          options: {
-            renderLayoutAs: "Table",
-          },
+          options: { renderLayoutAs: "Table" },
         },
         {
           id: "showLastUpdatedColumn",
           name: "Show last updated column",
           type: "Boolean",
-          options: {
-            defaultValue: true,
-          },
+          options: { defaultValue: true },
         },
       ],
-      appearance: {
-        isBordered: false,
-        hasBackground: false,
-      },
+      appearance: { isBordered: true, hasBackground: false },
       variants: [
         {
           id: "default",
@@ -2479,40 +1450,27 @@ const blocks: PageBlockDefinition[] = [
           },
           maxColumns: 1,
           defaultColumns: 1,
-          appearance: {
-            isBordered: false,
-            hasBackground: false,
-            isEditorPresentationDifferent: true,
-          },
+          appearance: { isBordered: true, hasBackground: false, isEditorPresentationDifferent: true },
         },
       ],
       defaultVariantKey: "default",
     },
-    behavior: {
-      dataType: "Component",
-      entities: {
-        selectionType: "Group",
-        maxSelected: 1,
-      },
-    },
+    behavior: { dataType: "Component", entities: { selectionType: "Group", maxSelected: 1 } },
     editorOptions: {
       onboarding: {
-        helpText: "Show the overview of all your components",
+        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: false,
-      hasBackground: false,
-    },
+    appearance: { isBordered: true, hasBackground: false },
   },
   {
     id: "io.supernova.block.component-health",
     name: "Component health",
-    description: "Show component health and additional attributes",
+    description: "Show component health and other attributes",
     category: "Components",
-    icon: "https://cdn-assets.supernova.io/blocks/icons/component-health.svg",
+    icon: "https://cdn-assets.supernova.io/blocks/icons/v2/component-health.svg",
     searchKeywords: ["components", "health", "properties", "overview", "status"],
     item: {
       properties: [
@@ -2520,15 +1478,10 @@ const blocks: PageBlockDefinition[] = [
           id: "components",
           name: "Components",
           type: "Component",
-          options: {
-            renderLayoutAs: "List",
-          },
+          options: { renderLayoutAs: "List" },
         },
       ],
-      appearance: {
-        isBordered: false,
-        hasBackground: false,
-      },
+      appearance: { isBordered: true, hasBackground: false },
       variants: [
         {
           id: "default",
@@ -2543,22 +1496,12 @@ const blocks: PageBlockDefinition[] = [
           },
           maxColumns: 1,
           defaultColumns: 1,
-          appearance: {
-            isBordered: false,
-            hasBackground: false,
-            isEditorPresentationDifferent: true,
-          },
+          appearance: { isBordered: true, hasBackground: false, isEditorPresentationDifferent: true },
         },
       ],
       defaultVariantKey: "default",
     },
-    behavior: {
-      dataType: "Component",
-      entities: {
-        selectionType: "Entity",
-        maxSelected: 1,
-      },
-    },
+    behavior: { dataType: "Component", entities: { selectionType: "Entity", maxSelected: 1 } },
     editorOptions: {
       onboarding: {
         helpText: "Show component health and additional attributes",
@@ -2566,9 +1509,6 @@ const blocks: PageBlockDefinition[] = [
           "https://learn.supernova.io/latest/documentation/types-of-blocks/component/component-health-sezSxEED",
       },
     },
-    appearance: {
-      isBordered: false,
-      hasBackground: false,
-    },
+    appearance: { isBordered: true, hasBackground: false },
   },
 ];