Scrolling to a dynamic height row?

    <Example names={names}/>

"use client";

import { List, useDynamicRowHeight, useListRef } from "react-window";
import { RowComponent } from "./RowComponent";
 
export function Example({ names }: { names: string[] }) {
  const rowHeight = useDynamicRowHeight({
    defaultRowHeight: 25,
  });
  const listRef = useListRef(null)

  const onClick = () => {
    const list = listRef.current;
    console.log("scrolling to row 250", list);
    list?.scrollToRow({
        align: "auto", // optional
        behavior: "auto", // optional
        index: 250
    });
    console.log("scrolled to row 250", list);
    };

  return (
    <>
    <button onClick={onClick}>Go to row 250</button>
    <List
      listRef={listRef}
      rowComponent={RowComponent}
      rowCount={names.length}
      rowHeight={rowHeight}
      rowProps={{ names }}
    />
    </>
  );
}

import { type RowComponentProps } from "react-window";
 
export function RowComponent({
  index,
  names,
  style
}: RowComponentProps<{
  names: string[];
}>) {
  return (
    <div className="flex items-center justify-between" style={style}> 
      {names[index]}
      <div className="text-slate-500 text-xs">{`${index + 1} of ${names.length}`}</div>
    </div>
  );
}