Add items that are not calculated in group height

[eeliinaa]

I am using itemRenderer() to draw my items but some of them are not regular ones. Example you can see in codesandbox i provided. There are 4 item in total. 2 of them are regular (blue) and red & gray are custom sizes. As you can see in example there is way too big space on top of first blue item and it is there because timeline thinks that gray and red items are regular too but I don't want that. I would like timeline to use space only for 2 items in that row (blue ones).

I think you could add new prop like "backgroundItem" and if it is set then that item is not calculated in group height and has the same top (css) value as first regular item.

https://codesandbox.io/s/timeline-demo-sticky-header-us44d?fontsize=14

[hckr]

I did a somewhat similar modification, but in my case, I needed an item to fill the whole (background) space of the group. I think I could contribute such a modification, but we should come up first with the flexible-enough API for this. Starting with the support for both your and my needs, and possible future needs of other users. I wouldn't want to contribute a code which would fit only one exact purpose, which is in your case – an item should have the same top position as the first item. In other (my) case one might need the item to have the top same as the beginning of a group, and height the same as the whole group.

It'd be great to start a discussion.

[Ilaiwi]

@hckr I am currently working on a feature for the package called rowRenderer. you can check out the prototype for it here
check it out and lmk