import React from 'react';
import { st, classes } from './BounceAnimation.st.css.js';
import Animate from '../Animate';
import { CHILD_SIZE, CHILD_WIDTH_RANGE } from './BounceAnimation.constants';
import { isValueInRange } from '../Animate/utils';
/** Bounce Animation*/
class BounceAnimation extends React.PureComponent {
    constructor(props) {
        super(props);
        this.rootRef = React.createRef();
        this.getAnimationSize = () => {
            const childWidth = this.rootRef.current?.offsetWidth ?? 0;
            const { from, to } = CHILD_WIDTH_RANGE.medium;
            return isValueInRange(childWidth, from, to)
                ? CHILD_SIZE.medium
                : CHILD_SIZE.small;
        };
        this.state = {
            animationSize: undefined,
        };
    }
    componentDidMount() {
        const animationSize = this.getAnimationSize();
        this.setState({ animationSize });
    }
    render() {
        const { dataHook, active, onEnd, onStart, loop, children, delay } = this.props;
        const { animationSize } = this.state;
        return (React.createElement(Animate, { dataHook: dataHook, delay: delay, animateClasses: st(classes.root, { active, loop, size: animationSize }), onEnd: onEnd, onStart: onStart, ref: this.rootRef }, children));
    }
}
Object.assign(BounceAnimation, {
    displayName: 'Bounce',
    defaultProps: {},
});
export default BounceAnimation;
//# sourceMappingURL=BounceAnimation.js.map