lightning-js / blits

The Lightning 3 App Development Framework
Apache License 2.0
58 stars 9 forks source link

Implement transition attribute #81

Open michielvandergeest opened 3 months ago

michielvandergeest commented 3 months ago

Currently we can specify transitions by adding the .transition modified on attributes.

For Elements with multiple transitions it might be useful to use a dedicated transitions attribute, that can contain an array of transition objects.

<Element w="200" h="200" x="1550" color="#4c1d95"
 :transitions="[
    {prop: 'y', value: $y, duration: 800, easing: 'cubic-bezier(1,-0.64,.39,1.44)', delay: 3000},
    {prop: 'x', value: $x, duration: 800, easing: 'ease-in', delay: 0},
  ]"
/>

It should also be possible for the array of transitions to be specified in a state and referenced inside the transitions attribute.