interface HoneycombPatternProps {
  className?: string;
  id?: string;
}

export function HoneycombPattern({ className, id = "honeycomb" }: HoneycombPatternProps) {
  return (
    <svg
      aria-hidden="true"
      className={className ?? "pointer-events-none absolute inset-0 h-full w-full stroke-primary/[0.07]"}
    >
      <defs>
        <pattern
          id={id}
          width="56"
          height="97"
          patternUnits="userSpaceOnUse"
          patternTransform="scale(1)"
        >
          <path
            fill="none"
            strokeWidth="1.5"
            d="M28 0 56 16.2 56 48.5 28 64.7 0 48.5 0 16.2Z M28 64.7 56 80.8 56 97 28 97 0 97 0 80.8Z"
          />
        </pattern>
      </defs>
      <rect width="100%" height="100%" fill={`url(#${id})`} stroke="none" />
    </svg>
  );
}