import { genSVGCubicBezier } from '../util';
export const MainCircle = (props) => {
    const publicProps = {
        dur: '0.35s',
        begin: '100ms',
        fill: 'freeze',
        calcMode: 'spline',
        keyTimes: '0; 0.6; 1',
        keySplines: '0.25 0.71 0.4 0.88; .59 .22 .87 .63',
    };
    return (<circle fill={props.fill} cx="16" cy="16" r="0">
      <animate attributeName="opacity" values="0; 1; 1" {...publicProps}/>
      <animate attributeName="r" values="0; 17.5; 16" {...publicProps}/>
    </circle>);
};
export const SecondaryCircle = (props) => {
    const publicProps = {
        dur: '1s',
        begin: props.begin || '320ms',
        fill: 'freeze',
        ...genSVGCubicBezier('0.0 0.0 0.2 1'),
    };
    return (<circle fill={props.fill} cx="16" cy="16" r="12" opacity="0">
      <animate attributeName="opacity" values="1; 0" {...publicProps}/>
      <animate attributeName="r" values="12; 26" {...publicProps}/>
    </circle>);
};