petalframework / petal_components

Phoenix + Live View HEEX Components
https://petal.build/components
MIT License
767 stars 84 forks source link

Progress component rounding causes jumpy animation #313

Open trentjones21 opened 3 months ago

trentjones21 commented 3 months ago

https://github.com/petalframework/petal_components/blob/39a2b5f879266e85abb8bdbb8075b99a7c233b1a/lib/petal_components/progress.ex#L22

I'm animating a Progress component, and I'm wondering if it's necessary to round the width percentage of the filled in portion of the bar. This causes the animation to be extremely jumpy when going from one full percentage point to the next.

Perhaps animation is outside the intended scope of this component, but would it hurt to either remove the round function or round it to a one or two decimal places, as opposed to whole numbers?

mplatts commented 3 months ago

Happy for it to be removed if it helps with performance and no negative effects. Not sure why we do it. Would you be able to do a PR?

trentjones21 commented 3 months ago

Yep! Here you go: https://github.com/petalframework/petal_components/pull/314