Merge pull request #28 from vinpac/master

Add support for Figma Embed Link

Author: tobiaslins

package.json

@@ -1,5 +1,5 @@
 {
-  "version": "0.8.0",
+  "version": "0.8.1",
   "license": "MIT",
   "main": "dist/index.js",
   "typings": "dist/index.d.ts",

src/block.tsx

@@ -240,6 +240,7 @@ export const Block: React.FC<Block> = props => {
 
     case "image":
     case "embed":
+    case "figma":
     case "video":
       const value = block.value as ContentValueType;
 

src/components/asset.tsx

@@ -1,7 +1,7 @@
 import * as React from "react";
 import { BlockType, ContentValueType, MapImageUrl } from "../types";
 
-const types = ["video", "image", "embed"];
+const types = ["video", "image", "embed", "figma"];
 
 const Asset: React.FC<{
   block: BlockType;
@@ -24,15 +24,18 @@ const Asset: React.FC<{
 
   const aspectRatio = block_aspect_ratio || block_height / block_width;
 
-  if (type === "embed" || type === "video") {
+  if (type === "embed" || type === "video" || type === "figma") {
     return (
       <div
         style={{
           paddingBottom: `${aspectRatio * 100}%`,
           position: "relative"
         }}
       >
-        <iframe className="notion-image-inset" src={display_source} />
+        <iframe
+          className="notion-image-inset"
+          src={type === "figma" ? value.properties.source[0][0] : display_source}
+        />
       </div>
     );
   }

src/types.ts

@@ -214,6 +214,11 @@ interface ImageValueType extends ContentValueType {
 interface EmbedValueType extends ContentValueType {
   type: "embed";
 }
+
+interface FigmaValueType extends ContentValueType {
+  type: "figma";
+}
+
 interface VideoValueType extends ContentValueType {
   type: "video";
 }
@@ -273,6 +278,7 @@ export type BlockValueType =
   | ImageValueType
   | VideoValueType
   | EmbedValueType
+  | FigmaValueType
   | CalloutValueType
   | BookmarkValueType
   | ToggleValueType