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

export function Ear({ 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="ear">
      <path
        d={EAR_PATH}
        fill={fill}
        stroke={style?.stroke}
        strokeWidth={style?.strokeWidth}
        style={{ transition: TRANSITION_STYLE }}
      />
    </g>
  );
}

const EAR_PATH =
  "M7 5C7 7.76142 5.433 10 3.5 10C1.567 10 0 7.76142 0 5C0 2.23858 1.567 0 3.5 0C5.433 0 7 2.23858 7 5Z";