jarv.is/components/HeadingAnchor/HeadingAnchor.tsx

import Link from "../Link";
import { LinkIcon } from "lucide-react";
import type { ComponentPropsWithoutRef } from "react";

export type HeadingAnchorProps = Omit<ComponentPropsWithoutRef<typeof Link>, "href" | "id"> & {
  id: string;
};

const HeadingAnchor = ({ id, ...rest }: HeadingAnchorProps) => {
  return (
    <Link href={`#${id}`} className="hover:no-underline" {...rest}>
      <LinkIcon size="0.9em" className="inline" />
    </Link>
  );
};

export default HeadingAnchor;