Types Missing from XYSeries class about amcharts5 HOT 10 CLOSED

import {
    Legend,
    Root,
    Scrollbar,
    Theme,
    Tooltip,
    color,
    p100,
    percent,
    time,
} from "@amcharts/amcharts5";
import {
    AxisRendererX,
    AxisRendererY,
    DateAxis,
    LineSeries,
    ValueAxis,
    XYChart,
    XYCursor,
} from "@amcharts/amcharts5/xy";

   useLayoutEffect(() => {
        /* Chart code */
        // Create root element
        // https://www.amcharts.com/docs/v5/getting-started/#Root_element
        let root = Root.new("chartdiv");

        const myTheme = Theme.new(root);

        myTheme.rule("AxisLabel", ["minor"]).setAll({
            dy: 1,
        });

        myTheme.rule("Grid", ["x"]).setAll({
            strokeOpacity: 0.05,
        });

        myTheme.rule("Grid", ["x", "minor"]).setAll({
            strokeOpacity: 0.05,
        });

        // Set themes
        // https://www.amcharts.com/docs/v5/concepts/themes/
        root.setThemes([am5themes_Animated.new(root), myTheme]);

        // Create chart
        // https://www.amcharts.com/docs/v5/charts/xy-chart/
        let chart = root.container.children.push(
            XYChart.new(root, {
                panX: true,
                panY: true,
                wheelX: "panX",
                wheelY: "zoomX",
                maxTooltipDistance: 0,
                pinchZoomX: true,
            })
        );

        let date = new Date();
        date.setHours(0, 0, 0, 0);
        let value = 100;

        function generateData() {
            value = Math.round(Math.random() * 10 - 4.2 + value);
            time.add(date, "day", 1);
            return {
                date: date.getTime(),
                value: value,
            };
        }

        function generateDatas(count: number) {
            let data = [];
            for (var i = 0; i < count; ++i) {
                data.push(generateData());
            }
            return data;
        }

        // Create axes
        // https://www.amcharts.com/docs/v5/charts/xy-chart/axes/
        let xAxis = chart.xAxes.push(
            DateAxis.new(root, {
                maxDeviation: 0.2,
                baseInterval: {
                    // if time breakdown changes
                    timeUnit: "month",
                    count: 1,
                },
                renderer: AxisRendererX.new(root, {
                    minorGridEnabled: true,
                }),
                tooltip: Tooltip.new(root, {}),
            })
        );

        let yAxis = chart.yAxes.push(
            ValueAxis.new(root, {
                renderer: AxisRendererY.new(root, {}),
            })
        );

        // Add series
        // https://www.amcharts.com/docs/v5/charts/xy-chart/series/
        for (var i = 0; i < 10; i++) {
            let series = chart.series.push(
                LineSeries.new(root, {
                    name: "Series " + i,
                    xAxis: xAxis,
                    yAxis: yAxis,
                    valueYField: "value",
                    valueXField: "date",
                    legendValueText: "{valueY}",
                    tooltip: Tooltip.new(root, {
                        pointerOrientation: "horizontal",
                        labelText: "{valueY}",
                    }),
                })
            );

            date = new Date();
            date.setHours(0, 0, 0, 0);
            value = 0;

            let data = generateDatas(100);
            series.data.setAll(data);

            // Make stuff animate on load
            // https://www.amcharts.com/docs/v5/concepts/animations/
            series.appear();
        }

        // Add cursor
        // https://www.amcharts.com/docs/v5/charts/xy-chart/cursor/
        let cursor = chart.set(
            "cursor",
            XYCursor.new(root, {
                behavior: "none",
            })
        );
        cursor.lineY.set("visible", false);

        // Add scrollbar
        // https://www.amcharts.com/docs/v5/charts/xy-chart/scrollbars/
        chart.set(
            "scrollbarX",
            Scrollbar.new(root, {
                orientation: "horizontal",
            })
        );

        chart.set(
            "scrollbarY",
            Scrollbar.new(root, {
                orientation: "vertical",
            })
        );

        // Add legend
        // https://www.amcharts.com/docs/v5/charts/xy-chart/legend-xy-series/
        let legend = chart.rightAxesContainer.children.push(
            Legend.new(root, {
                width: 150,
                paddingLeft: 15,
                height: percent(100),
            })
        );

        // When legend item container is hovered, dim all the series except the hovered one
        legend.itemContainers.template.events.on("pointerover", function (e) {
            let itemContainer = e.target;

            // As series list is data of a legend, dataContext is series
            let series = itemContainer.dataItem?.dataContext;

            chart.series.each(function (chartSeries) {
                if (chartSeries != series) {
                    // errors here because chartSeries is seen as XYSeries
                    chartSeries.strokes.template.setAll({
                        strokeOpacity: 0.15,
                        stroke: color(0x000000),
                    });
                } else {
                    // @ts-ignore
                    chartSeries.strokes.template.setAll({
                        strokeWidth: 3,
                    });
                }
            });
        });

        // When legend item container is unhovered, make all series as they are
        legend.itemContainers.template.events.on("pointerout", function (e) {
            let itemContainer = e.target;
            let series = itemContainer.dataItem?.dataContext;

            chart.series.each(function (chartSeries) {
                // @ts-ignore
                chartSeries.strokes.template.setAll({
                    strokeOpacity: 1,
                    strokeWidth: 1,
                    stroke: chartSeries.get("fill"),
                });
            });
        });

        legend.itemContainers.template.set("width", p100);
        legend.valueLabels.template.setAll({
            width: p100,
            textAlign: "right",
        });

        // It's is important to set legend data after all the events are set on template, otherwise events won't be copied
        legend.data.setAll(chart.series.values);

        return () => {
            root.dispose();
        };
    }, []);