potty-chart/src/Icon.tsx

16 lines
435 B
TypeScript

import React from 'react';
import {useSpring, animated} from '@react-spring/web';
const Icon = ({emoji, className}:{emoji: string, className: string}) => {
const springs = useSpring({
from: {scale: 0.5, rotate: -45},
to: [
{scale: 1.3, rotate: 45},
{scale: 1, rotate: 0}
]});
return <animated.div style={springs} className={`${className} cell checked`}>
{emoji}
</animated.div>
}
export default Icon;