Independent speeds

[arsmth]

Can we have independent speeds for each child? For example:

<h2>
  <TextLoop speed="1000">
    <span speed="2000">I stick around for 2 seconds!</span>
    <span>I just default to 1 second</span>
  </TextLoop>
</h2>

This way I can set a default speed value on the TextLoop but also specify individual speeds on each child.

[braposo]

Oh that's an interesting suggestion @arsmth! Never thought about it to be honest and it would be complicated to do with the current implementation, which is based on setInterval to run the transition between words.

Maybe chaining setTimeout instead and use the speed prop to change the timeout would work, do you have any suggestion about the implementation?

I'll take a look either way, it's worth adding something like that for sure, thanks for your comment!

[arsmth]

I'm not too clued up on this so I wouldn't be able to suggest much of value. Would taking speed as an array and just crudely cycling through that when setting your interval in componentDidUpdate work?

[braposo]

Don't worry @arsmth, I'm sure we can get to something that works for the case you presented.

I already have a few ideas on how to get this to work. Thanks for your suggestion, the tricky thing about it is that it's a bit easier to make mistakes if there's a mismatch between the array and the component's children length so I might try something more "secure".

[oyeanuj]

@braposo This pattern could also help with #12

[braposo]

You can now use an array for the interval prop to have different values for each child. This is available in v2.0.0 release.