
// GENERATED BY ./scripts/iconScript.ts

import * as React from 'react';
import { IconProps, valuesMap } from '../helper';
import { flipFunction } from '../flipFunction';
import classNames from 'classnames';

function EoscompassAnimated({size = "m", color = "black", rotate = 0, horizontalFlip = false, verticalFlip = false, className}: IconProps) {
    const sizeString: string = size.toString()
    if(Object.keys(valuesMap).includes(sizeString)) {
        size = valuesMap[size]
    }
    const { scaleX, scaleY, translateX, translateY } = flipFunction({horizontalFlip,verticalFlip})
    const classString = classNames(className);
return (
      <svg className={classString} data-testid="eos-svg-component" transform={`rotate(${rotate}, 12, 12) translate(${translateX}, ${translateY}) scale(${scaleX}, ${scaleY})`} fill={color} width={size} height={size} xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" >
<path d="M12 10.9c-.61 0-1.1.49-1.1 1.1s.49 1.1 1.1 1.1c.61 0 1.1-.49 1.1-1.1s-.49-1.1-1.1-1.1zM12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm2.19 12.19L6 18l3.81-8.19L18 6l-3.81 8.19z">
    <animateTransform id="first" attributeName="transform" attributeType="XML" type="rotate" from="-90 12 12" to="0 12 12" dur="1s" begin="0;third.end"/>
    <animateTransform id="second" attributeName="transform" attributeType="XML" type="rotate" from="0 12 12" to="-90 12 12" dur="1s" begin="first.end"/>
    <animateTransform id="third" attributeName="transform" attributeType="XML" type="rotate" from="-90 12 12" to="270 12 12" dur="1s" begin="second.end"/>
</path>
</svg>
    );
};

export default EoscompassAnimated;
