using useState inside a non react component – no error

I am not sure why this code works. Can someone explain?

File name : test.tsx

import { useState } from "react";

export const getComponents = () => {
  const hello = [].map(() => {
    const [state] = useState(0);
    return {
      b: "hello",
      d: <div>{state}</div>,
    };
  });
  return hello;
};

getComponents is not a React.isValidElement. Why am I able to use useState inside this function?

Codesandbox example : https://codesandbox.io/p/live/7f832aa1-c029-4083-98dd-c0068c502bc5

I would expect eslint to give me an error : ““react hooks must be called in a react function component or a custom react hook function”.”