import { forwardRef } from "react";
import type { Icon, IconProps } from "@phosphor-icons/react";

export const WizardOrbIcon = forwardRef<SVGSVGElement, IconProps>(
  (
    { size = 24, color = "currentColor", weight = "regular", mirrored, alt, style, ...rest },
    ref
  ) => {
    const strokeWidth = weight === "bold" ? 20 : 16;

    return (
      <svg
        ref={ref}
        xmlns="http://www.w3.org/2000/svg"
        viewBox="0 0 256 256"
        width={size}
        height={size}
        fill="none"
        style={{
          transform: mirrored ? "scale(-1, 1)" : undefined,
          ...style,
        }}
        {...(alt ? { role: "img", "aria-label": alt } : { "aria-hidden": true })}
        {...rest}
      >
        <circle
          cx="128"
          cy="112"
          r="66"
          stroke={color}
          strokeWidth={strokeWidth}
          fill={weight === "duotone" ? color : "none"}
          fillOpacity={weight === "duotone" ? 0.18 : undefined}
        />
        <path
          d="M94 96 a 44 44 0 0 1 30 -26"
          stroke={color}
          strokeWidth={strokeWidth * 0.7}
          strokeLinecap="round"
          fill="none"
        />
        <path
          d="M96 194 h64 l16 26 h-96 z"
          stroke={color}
          strokeWidth={strokeWidth}
          strokeLinejoin="round"
          fill="none"
        />
        <path
          d="M208 26 l8 16 16 8 -16 8 -8 16 -8 -16 -16 -8 16 -8 z"
          fill={color}
        />
      </svg>
    );
  }
) as Icon;

export default WizardOrbIcon;
