Несколько CSS трансформаций на одном компоненте React

Я добавил эффект появления fadeIn на компоненте в проекте из библиотеки Animate.css, но оказалось, что он отменяет мою трансформацию transform: translate(-50%, -50%);.

Я понимаю, чтобы работало верно, надо перечислить трансформации в transform: ... ... ..., но у меня получается к одному компоненту применяется несколько трансформаций одновременно: одна из стиля самого компонента, другой из Animate.css, а третий пожет быть прокинут из props.

Подскажите, пожалуйста, есть ли какой-то другой способ применять несколько трансформации к одному элементу, чтобы они не отменяли друг друга?