Offset CSS Translate for Filtering?
gpsugy opened this issue · comments
First of all, great library. Thank you for all your work.
This may/may not be a feature request, but I am more-so asking if there is some way to already do this.
The Question
Is there a way to offset the translations for certain items at the time that filtering makes its calculations for them?
Use Case
Making the grid a single flexbox element with a defined width that flexwraps, but trying to always make the first "row" (not literally, but visually) items offset to the right with an additional 200px in their CSS translations. Visually, this would look like the bottom two steps of a staircase.
Alternative Considerations
If this is not a current feature, could I be redirected as to where in the repo this translation logic is occurring, so that I might be able to configure those calculations manually?
Perhaps there is a way to separate the filtering logic (to decide what items will become visible/hidden), the resulting CSS translations of the visible items, and the actual animation trigger from one another that I am unaware of? In my case, this would allow correct filtering of the items but with custom translations (or perhaps even other CSS) with full control of when to trigger the animation based on those adjustments.
Thanks once again.
This is where layouts are calculated
Shuffle/packages/shuffle/src/shuffle.js
Line 479 in 28dad51
To hack it, you could extend the Shuffle class and override the _layout, _getNextPositions, or _getItemPosition methods.