complete exmaple does not work

Module not found: Error: Can't resolve 'echarts-for-react-fc/src/hooks/useTooltip' Module not found: Error: Can't resolve 'echarts-for-react-fc/lib/hooks/useTooltip'
Frameworks/Libraries used React 18.2.0 echarts-for-react-fc 1.0.0
a complete exmaple.
import { useCallback, useEffect, useMemo, useState } from "react";

import * as echarts from "echarts/core";
import { GridComponent, TooltipComponent } from "echarts/components";
import { LineChart, PieChart } from "echarts/charts";
import { UniversalTransition } from "echarts/features";
import { CanvasRenderer, SVGRenderer } from "echarts/renderers";

import EChartsReact, {
  useChart,
  EChartsReactProps,
} from "echarts-for-react-fc";

echarts.use([
  GridComponent,
  TooltipComponent,
  LineChart,
  PieChart,
  CanvasRenderer,
  SVGRenderer,
  UniversalTransition,
]);

const createTooltipFn: CreateTooltipFn = ({ params }) => {
  if (Array.isArray(params)) {
    return (
      <div>
        {params.map((item) => (
          <div>{item.name}</div>
        ))}
      </div>
    );
  } else {
    return <div>{params.name}</div>;
  }
};

const TestChart = () => {
  const { chartRef, setChartOption, handleListenChartReady } = useChart();

  const { tooltipDom, tooltipRender, createTooltip } = useTooltip({
    component: createTooltipFn,
  });

  const [renderer, setRenderer] = useState<"svg" | "canvas">("canvas");

  const [number, setNumber] = useState(100);

  const setR = () => {
    setRenderer((old) => {
      if (old === "canvas") return "svg" as const;
      if (old === "svg") return "canvas" as const;
    });
  };

  const handleClickSetPieOption = () => {
    setChartOption(
      {
        series: [
          {
            name: "Access From",
            type: "pie",
            radius: "50%",
            data: [
              { value: 1048, name: "Search Engine" },
              { value: 735, name: "Direct" },
              { value: 580, name: "Email" },
              { value: 484, name: "Union Ads" },
              { value: 300, name: "Video Ads" },
            ],
            emphasis: {
              itemStyle: {
                shadowBlur: 10,
                shadowOffsetX: 0,
                shadowColor: "rgba(0, 0, 0, 0.5)",
              },
            },
          },
        ],
      },
      {
        notMerge: true,
      }
    );
  };

  const handleClickSetLineOption = () => {
    setChartOption(
      {
        xAxis: {
          type: "category",
          data: ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"],
        },
        yAxis: {
          type: "value",
        },
        series: [
          {
            id: 1,
            data: [150, 230, 224, 218, 135, 147, 260],
            type: "line",
          },
        ],
      },
      {
        notMerge: true,
      }
    );
  };

  useEffect(() => {
    setChartOption({
      tooltip: {
        formatter: (params) => {
          setTimeout(() => {
            createTooltip({ params });
          }, 100);
          return tooltipDom;
        },
      },
      xAxis: {
        type: "category",
        data: ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"],
      },
      yAxis: {
        type: "value",
      },
      series: [
        {
          id: 1,
          data: [150, 230, 224, 218, 135, 147, 260],
          type: "line",
        },
      ],
    });

    setTimeout(() => {
      setChartOption({
        series: [
          {
            id: 2,
            data: [400, 130, 224, 118, 35, 47, 260],
            type: "line",
          },
        ],
      });
    }, 2000);
  }, []);

  const setNumberFn = useCallback(function (e) {
    console.log("The first binding", e);
    setNumber(e.value);
  }, []);

  const events = useMemo<EChartsReactProps["onEvents"]>(() => {
    return {
      click: [
        {
          query: { seriesId: "1" },
          handler: setNumberFn,
        },
        {
          handler: function (e) {
            console.log("The second binding", e);
          },
        },
      ],
    };
  }, [setNumberFn]);

  return (
    <>
      <button onClick={handleClickSetPieOption}>set pie chart</button>
      <button onClick={handleClickSetLineOption}>set line chart</button>
      <button onClick={setR}>{renderer}set renderer type</button>
      <> {number}</>
      <EChartsReact
        style={{
          width: "100%",
          height: 300,
        }}
        ref={chartRef}
        initOpts={{
          renderer: renderer,
        }}
        autoResize={true}
        onEvents={events}
        echarts={echarts}
        onChartReady={handleListenChartReady}
      />
      {tooltipRender}
    </>
  );
};

export default TestChart;
mmmml-zhao / echarts-for-react-fc

complete exmaple does not work #8
