"use client";

import { useState, useEffect } from "react";

export default function Cursor() {
  const [on, setOn] = useState(true);

  useEffect(() => {
    const i = setInterval(() => setOn((v) => !v), 530);
    return () => clearInterval(i);
  }, []);

  return (
    <span
      style={{
        display: "inline-block",
        width: 10,
        height: "1.1em",
        background: on ? "var(--accent)" : "transparent",
        marginLeft: 2,
        verticalAlign: "text-bottom",
        transition: "background 0.05s",
      }}
    />
  );
}