import { useState } from "react";

interface ContextMenuProps {
  items: string[];
  onSelect: (item: string) => void;
}

const ContextMenu: React.FC<ContextMenuProps> = ({ items, onSelect }) => {
  return (
    <div
      style={{
        position: "absolute",
        border: "1px solid #ccc",
        backgroundColor: "#fff",
        boxShadow: "0px 0px 10px rgba(0, 0, 0, 0.1)",
        zIndex: 1000,
      }}
    >
      <ul style={{ margin: 0, padding: 10, listStyleType: "none" }}>
        {items.map((item, index) => (
          <li
            key={index}
            style={{ padding: "5px 10px", cursor: "pointer" }}
            onClick={() => onSelect(item)}
          >
            {item}
          </li>
        ))}
      </ul>
    </div>
  );
};

export default ContextMenu;