import { TRANSITION_STYLE } from "../constants";
import type { OrganSvgProps } from "../types";

export function Eye({ style, colorScale, isActive = false, className }: OrganSvgProps) {
  const defaultColor = colorScale[100];
  const activeColor = colorScale[300];
  const fill = style?.fill ?? (isActive ? activeColor : defaultColor);

  return (
    <g className={className} data-organ="eye">
      <path
        d={EYE_PATH}
        fill={fill}
        stroke={style?.stroke}
        strokeWidth={style?.strokeWidth}
        style={{ transition: TRANSITION_STYLE }}
      />
    </g>
  );
}

const EYE_PATH =
  "M11 6C11 8.76142 8.76142 11 6 11C3.23858 11 1 8.76142 1 6C1 3.23858 3.23858 1 6 1C8.76142 1 11 3.23858 11 6Z";