import { IconProps } from "@radix-ui/react-icons/dist/types";
import * as React from "react";

/** Figma-style component glyph: four diamonds around the center. */
export const ComponentIcon = React.memo(function ComponentIcon({
  color = "currentColor",
  ...props
}: IconProps) {
  return (
    <svg
      width="15"
      height="15"
      viewBox="0 0 15 15"
      fill="none"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <path
        d="M7.5 1.5L9.5 3.5L7.5 5.5L5.5 3.5L7.5 1.5Z"
        fill={color}
      />
      <path
        d="M11.5 5.5L13.5 7.5L11.5 9.5L9.5 7.5L11.5 5.5Z"
        fill={color}
      />
      <path
        d="M7.5 9.5L9.5 11.5L7.5 13.5L5.5 11.5L7.5 9.5Z"
        fill={color}
      />
      <path
        d="M3.5 5.5L5.5 7.5L3.5 9.5L1.5 7.5L3.5 5.5Z"
        fill={color}
      />
    </svg>
  );
});