trying out

Author: rylax

dev/serve.vue

@@ -23,7 +23,9 @@ export default {
     // react-notion tester: 2e22de6b770e4166be301490f6ffd420
     // equation tester: 2a1d5226d68246deba627012081693f9
     // todo tester: 235057194b954a60ace89c052a65d102
-    this.blockMap = await getPageBlocks("2e22de6b770e4166be301490f6ffd420");
+    // this.blockMap = await getPageBlocks("2e22de6b770e4166be301490f6ffd420"); // Original
+    this.blockMap = await getPageBlocks("4bdce11cd93544e5b96e5b1857cea6dc"); // Sync block
+    console.log("blockMap", this.blockMap);
   },
 };
 </script>

src/blocks/sync-pointer.vue

@@ -0,0 +1,52 @@
+<template>
+  <div>
+    just a test {{ referencePointerId }}
+    <!-- <NotionRenderer2 name="uniquerenderer" :blockMap="testMap" /> -->
+  </div>
+</template>
+
+<script>
+import Blockable, { blockComputed } from "@/lib/blockable";
+// import NotionRenderer2 from "@/components/notion-renderer";
+export default {
+  extends: Blockable,
+  name: "NotionSyncPointer",
+  components: {
+    // NotionRenderer2,
+  },
+  computed: {
+    ...blockComputed,
+    referencePointerId() {
+      return this.format?.transclusion_reference_pointer?.id;
+    },
+    testMap() {
+      return {
+        "619b49d9-6b25-489d-88ae-8bd47545ec09": {
+          role: "reader",
+          value: {
+            id: "619b49d9-6b25-489d-88ae-8bd47545ec09",
+            version: 53,
+            type: "header",
+            properties: {
+              title: [["New origin sync block"]],
+            },
+            created_time: 1647109620000,
+            last_edited_time: 1647109620000,
+            parent_id: "4bdce11c-d935-44e5-b96e-5b1857cea6dc",
+            parent_table: "block",
+            alive: true,
+            created_by_table: "notion_user",
+            created_by_id: "f0199428-7aba-473e-86b9-eb9f78d896c6",
+            last_edited_by_table: "notion_user",
+            last_edited_by_id: "f0199428-7aba-473e-86b9-eb9f78d896c6",
+            space_id: "a61a30bd-677b-4bab-b5c8-1863fec1f096",
+          },
+        },
+      };
+    },
+  },
+};
+</script>
+
+<style>
+</style>

src/components/block.vue

@@ -35,9 +35,14 @@
     v-bind="pass"
   />
   <NotionTable v-else-if="isType('table')" v-bind="pass" />
+  <NotionSyncPointer
+    v-else-if="isType('transclusion_reference')"
+    v-bind="pass"
+  />
   <hr v-else-if="isType('divider')" class="notion-hr" />
   <div v-else-if="todo && visible">
     todo: {{ type }}
+
     <slot />
   </div>
   <!-- todo: maybe add message on !production if block type unsupported -->
@@ -59,11 +64,12 @@ import NotionToggle from "@/blocks/toggle";
 import NotionQuote from "@/blocks/quote";
 import NotionEquation from "@/blocks/equation";
 import NotionTodo from "@/blocks/todo";
-import NotionTable from '@/blocks/table'
+import NotionTable from "@/blocks/table";
+import NotionSyncPointer from "@/blocks/sync-pointer";
 
 export default {
   extends: Blockable,
-  name: 'NotionBlock',
+  name: "NotionBlock",
   components: {
     NotionBookmark,
     NotionCallout,
@@ -78,7 +84,8 @@ export default {
     NotionQuote,
     NotionTable,
     NotionEquation,
+    NotionSyncPointer,
     NotionTodo,
   },
-}
+};
 </script>