import * as React from "react";
import { SVGProps } from "react";
import PropTypes from "prop-types";

function SvgVolume(props: SVGProps<SVGSVGElement>) {
  return (
    <svg
      width={38}
      height={30}
      fill="none"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <g filter="url(#volume_svg__a)">
        <path
          d="M28.428 5.573a13.333 13.333 0 0 1 0 18.854M23.721 10.28a6.667 6.667 0 0 1 0 9.427m-6.053-14.04L11.001 11H5.668v8h5.333l6.667 5.333V5.667Z"
          stroke="#fff"
          strokeWidth={3}
          strokeLinecap="round"
          strokeLinejoin="round"
          shapeRendering="crispEdges"
        />
      </g>
      <defs>
        <filter
          id="volume_svg__a"
          x={0.168}
          y={0.073}
          width={37.664}
          height={29.853}
          filterUnits="userSpaceOnUse"
          colorInterpolationFilters="sRGB"
        >
          <feFlood floodOpacity={0} result="BackgroundImageFix" />
          <feColorMatrix
            in="SourceAlpha"
            values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
            result="hardAlpha"
          />
          <feOffset />
          <feGaussianBlur stdDeviation={2} />
          <feComposite in2="hardAlpha" operator="out" />
          <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0" />
          <feBlend
            in2="BackgroundImageFix"
            result="effect1_dropShadow_5576_96"
          />
          <feBlend
            in="SourceGraphic"
            in2="effect1_dropShadow_5576_96"
            result="shape"
          />
        </filter>
      </defs>
    </svg>
  );
}

SvgVolume.propTypes = {
  title: PropTypes.string,
};
export default SvgVolume;
