How to access path params from inside child or grand child which in separate file?

function RouteComponent() {
  const { id } = Route.useParams();

  return <BlogPage id={id} />;
}

function RouteComponent() {
  const { id } = Route.useParams();

  return <BlogPage id={id} />;
}

I can use

useParams

useParams

here

blog.$id.tsx

blog.$id.tsx

to access the path param but I can't get it from inside

BlogPage

BlogPage

I can definitely pass as props but I also need that down the component tree. In react router I can use

const { page } = useParams()

const { page } = useParams()

and get access anywhere.