import * as React from "react";
import type { IconProps, IconMetadata, IconComponent } from "../../types";

export const Keycloak: IconComponent = React.forwardRef<
  SVGSVGElement,
  IconProps
>(function Keycloak(
  {
    color = "currentColor",
    fill,
    size = 24,
    strokeWidth,
    strokeLinecap,
    strokeLinejoin,
    strokeDasharray,
    opacity,
    className,
    ...props
  },
  forwardedRef,
) {
  return (
    <svg
      width={size}
      height={size}
      viewBox="0 0 24 24"
      fill="none"
      xmlns="http://www.w3.org/2000/svg"
      className={className}
      strokeWidth={strokeWidth}
      strokeLinecap={strokeLinecap}
      strokeLinejoin={strokeLinejoin}
      strokeDasharray={strokeDasharray}
      opacity={opacity}
      {...props}
      ref={forwardedRef}
    >
      <g clipPath="url(#undefined-clip0_2062_2084)">
        <path
          d="M3.12888 6.43465L6.21511 1.0019L18.6437 1.00024L21.7132 6.48695L21.717 17.4625L18.6442 22.9461L6.21942 22.9504L3.09756 17.4631L3.12888 6.43465Z"
          fill="#4d4d4d"
        />
        <path
          d="M3.0981 17.4615H8.6993L5.6228 11.9324L8.12481 6.4358L3.12941 6.43469L0 11.977"
          fill="#ededed"
        />
        <path
          d="M10.3979 17.4615H14.4921L18.1124 12.08L14.5553 6.48755H9.73919L6.83817 11.8917L10.3979 17.4615Z"
          fill="#e0e0e0"
        />
        <path
          d="M0 11.9764L3.0981 17.4631H8.69984L5.65681 11.9952L0 11.9764Z"
          fill="#acacac"
        />
        <path
          d="M6.89703 11.9775L10.3984 17.4631H14.4921L18.0557 11.9797L6.89703 11.9775Z"
          fill="#9e9e9e"
        />
        <path
          d="M8.28355 11.9804L7.22691 12.2942L6.21292 11.9798L10.3526 4.66162L11.3881 6.4887"
          fill="#00b8e3"
        />
        <path
          d="M11.3838 17.4616L10.3536 19.2963L7.60379 16.2749L6.21078 11.9815V11.9792H8.28301"
          fill="#33c6e9"
        />
        <path
          d="M6.21347 11.9798H6.21132V11.9815L5.17627 13.8107L4.13692 11.9897L5.19086 10.1252L8.28356 4.66272H10.3536"
          fill="#008aaa"
        />
        <path
          d="M17.6037 17.4615H23.8734L23.8696 6.48694H17.6037V17.4615Z"
          fill="#d4d4d4"
        />
        <path
          d="M17.6037 11.9946V17.4625H23.862V11.9946H17.6037Z"
          fill="#919191"
        />
        <path
          d="M10.3547 19.2984H8.28301L5.17627 13.8101L6.21131 11.9819L10.3547 19.2984Z"
          fill="#00b8e3"
        />
        <path
          d="M18.6377 11.9797L14.497 19.2968C14.1164 18.7263 13.4642 17.4631 13.4642 17.4631L16.5703 11.9786L18.6377 11.9797Z"
          fill="#008aaa"
        />
        <path
          d="M16.565 19.2968L14.497 19.2963L18.6383 11.9792L19.6727 10.1521L20.7106 11.9913M18.6377 11.9797H16.5709L13.4636 6.48807L14.4921 4.66321L17.0071 7.92418L18.6377 11.9797Z"
          fill="#00b8e3"
        />
        <path
          d="M19.6727 10.1511V10.1527L18.6377 11.9798L14.4927 4.66382L16.5666 4.66491L19.6727 10.1511Z"
          fill="#33c6e9"
        />
      </g>
      <defs>
        <clipPath id="undefined-clip0_2062_2084">
          <path fill="#fff" transform="translate(0 1)" d="M0 0H24V22H0z" />
        </clipPath>
      </defs>
    </svg>
  );
});

Keycloak.displayName = "Keycloak";

Keycloak.metadata = {
  name: "Keycloak",
  category: "icon/authentication",
  tags: ["keycloak", "icon"],
  description: "Keycloak icon from icon/authentication category",
  type: ["stroke", "icon"],
} as IconMetadata;

export default Keycloak;
