在使用ant chart的FlowAnalysisGraph這個結構關係圖表的時候遇到ts報錯。

我測試的是官方範例，程式碼如下：

import React from 'react';
import ReactDOM from 'react-dom';
import { FlowAnalysisGraph } from '@ant-design/graphs';

const DemoFlowAnalysisGraph = () => {
  const data = {
    nodes: [
      {
        id: '-3',
        value: {
          title: '来源页面A',
          items: [
            {
              text: '曝光PV',
              value: '10.30万',
              icon: 'https://gw.alipayobjects.com/zos/antfincdn/iFh9X011qd/7797962c-04b6-4d67-9143-e9d05f9778bf.png',
            },
          ],
        },
      },
      {
        id: '-2',
        value: {
          title: '来源页面B',
          items: [
            {
              text: '点击UV',
              value: '10.30万',
              icon: 'https://gw.alipayobjects.com/zos/antfincdn/iFh9X011qd/7797962c-04b6-4d67-9143-e9d05f9778bf.png',
            },
          ],
        },
      },
      {
        id: '-1',
        value: {
          title: '来源页面C',
          items: [
            {
              text: '访问页面UV',
            },
          ],
        },
      },
      {
        id: '0',
        value: {
          title: '活动页面',
          items: [
            {
              text: '访问页面UV',
            },
          ],
        },
      },
      {
        id: '1',
        value: {
          title: '去向页面A',
          items: [
            {
              text: '访问页面UV',
            },
          ],
        },
      },
      {
        id: '2',
        value: {
          title: '去向页面B',
          items: [
            {
              text: '访问页面UV',
            },
          ],
        },
      },
      {
        id: '3',
        value: {
          title: '去向页面C',
          items: [
            {
              text: '访问页面UV',
            },
          ],
        },
      },
      {
        id: '4',
        value: {
          title: '去向页面D',
          items: [
            {
              text: '访问页面UV',
            },
          ],
        },
      },
      {
        id: '5',
        value: {
          title: '去向页面E',
          items: [
            {
              text: '访问页面UV',
            },
          ],
        },
      },
      {
        id: '6',
        value: {
          title: '去向页面F',
          items: [
            {
              text: '访问页面UV',
            },
          ],
        },
      },
      {
        id: '6',
        value: {
          title: '去向页面F',
          items: [
            {
              text: '访问页面UV',
            },
          ],
        },
      },
      {
        id: '7',
        value: {
          title: '去向页面G',
          items: [
            {
              text: '访问页面UV',
            },
          ],
        },
      },
      {
        id: '8',
        value: {
          title: '去向页面H',
          items: [
            {
              text: '访问页面UV',
            },
          ],
        },
      },
    ],
    edges: [
      {
        source: '-3',
        target: '0',
        value: '来源A',
      },
      {
        source: '-2',
        target: '0',
        value: '来源B',
      },
      {
        source: '-1',
        target: '0',
        value: '来源C',
      },
      {
        source: '0',
        target: '1',
      },
      {
        source: '0',
        target: '2',
      },
      {
        source: '0',
        target: '3',
      },
      {
        source: '0',
        target: '4',
      },
      {
        source: '0',
        target: '5',
      },
      {
        source: '2',
        target: '6',
      },
      {
        source: '3',
        target: '7',
      },
      {
        source: '4',
        target: '8',
      },
    ],
  };
  const config = {
    data,
    layout: {
      rankdir: 'TB',
      ranksepFunc: () => 20,
    },
    nodeCfg: {
      anchorPoints: [
        [0.5, 0],
        [0.5, 1],
      ],
    },
    edgeCfg: {
      type: 'polyline',
      endArrow: true,
    },
    markerCfg: (cfg) => {
      return {
        position: 'bottom',
        show: data.edges.filter((item) => item.source === cfg.id)?.length,
      };
    },
    behaviors: ['drag-canvas', 'zoom-canvas', 'drag-node'],
  };

  return <FlowAnalysisGraph {...config} />;   // 這一行報錯
};

ReactDOM.render(<DemoFlowAnalysisGraph />, document.getElementById('container'));

我在React+TypeScript中使用，但是在return <FlowAnalysisGraph {...config} />;這行程式碼，ts報了以下錯誤：

(alias) const FlowAnalysisGraph: React.FC
import FlowAnalysisGraph
Type '{ data: { nodes: ({ id: string; value: { title: string; items: { text: string; value: string; icon: string; }[]; }; } | { id: string; value: { title: string; items: { text: string; }[]; }; })[]; edges: ({ source: string; target: string; value: string; } | { ...; })[]; }; ... 4 more ...; behaviors: string[]; }' is not assignable to type 'FlowAnalysisGraphConfig'.
Types of property 'layout' are incompatible.
Type '{ rankdir: string; ranksepFunc: () => number; }' is missing the following properties from type 'DagreLayout': align, begin, nodeSize, nodesepFunc, and 22 more.ts(2322)

**我也看了安裝包裡的官方的型別文件，安裝完後的.d.ts裡，就是跟它上面的那個範例型別內容不同，根據ts所報的錯誤，如果我要自己寫一個型別去定義的話，至少還有22個屬性得寫，但是這些屬性在node_module裡的型別文件裡沒有，在官方網站裡的API介紹的部分，也沒有寫

官方的文件裡，layout(報錯的部分)只有這些：**

layout(布局)：
{
/** Direction for rank nodes. Can be TB, BT, LR, or RL, where T = top, B = bottom, L = left, and R = right. /
rankdir: 'LR',
/* Layout center. /
center: [0, 0],
/* Number of pixels that separate nodes vertically in the layout. /
nodesepFunc: () => 1,
/* Number of pixels that separate nodes horizontally in the layout. */
ranksepFunc: () => 1,
}

然而我也嘗試將layout的prop部分註解掉，結果也有其他幾個屬性也型別錯誤...

我安裝的ant chart版本跟官方網站的版本是一樣的，都是1.4.2

不知道有沒有什麼方法可以解決這個問題呢?