Merge pull request #280 from storybookjs/pocka/upgrade-figspec

Upgrade figspec to v2

Author: ghengeveld

packages/storybook-addon-designs/package.json

@@ -43,7 +43,7 @@
     "release": "npm run prepublishOnly && auto shipit"
   },
   "dependencies": {
-    "@figspec/react": "^1.0.0"
+    "@figspec/react": "^2.0.0"
   },
   "peerDependencies": {
     "@storybook/addon-docs": "^10.0.0 || ^10.0.0-0 || ^10.1.0-0 || ^10.2.0-0",

packages/storybook-addon-designs/src/manager/components/Figspec.tsx

@@ -32,12 +32,15 @@ type RenderItem =
       type: "file";
       props: Pick<
         FigspecFileViewerProps,
-        "documentNode" | "renderedImages" | "link"
+        "apiResponse" | "renderedImages" | "link"
       >;
     }
   | {
       type: "frame";
-      props: Pick<FigspecFrameViewerProps, "nodes" | "renderedImage" | "link">;
+      props: Pick<
+        FigspecFrameViewerProps,
+        "apiResponse" | "renderedImage" | "link"
+      >;
     };
 
 type Remote<T, E = Error> =
@@ -139,7 +142,7 @@ export const Figspec: FC<Props> = ({ config }) => {
           value: {
             type: "file",
             props: {
-              documentNode,
+              apiResponse: documentNode,
               renderedImages: images.images,
               link: config.url,
             },
@@ -168,7 +171,11 @@ export const Figspec: FC<Props> = ({ config }) => {
         value: {
           type: "frame",
           props: {
-            nodes,
+            // Type mismatch due to different figma-js versions. As that library is
+            // no longer maintained, upstream should mark this property `unknown` or
+            // provided its own interface.
+            apiResponse:
+              nodes as unknown as FigspecFrameViewerProps["apiResponse"],
             renderedImage: Object.values<string>(images.images)[0],
             link: config.url,
           },