captivationsoftware/react-sticky

Allow placeholder padding override?

Closed this issue · 1 comments

ardok commented

Hello,

Is there a way to have custom padding placeholder?
https://github.com/captivationsoftware/react-sticky/blob/master/src/Sticky.js#L59

Maybe expose this particular section:

    const placeholderClientRect = this.placeholder.getBoundingClientRect();
    const contentClientRect = this.content.getBoundingClientRect();
    const calculatedHeight = contentClientRect.height;

To be something like:

getPlaceholderHeight(placeholder, content) {
    const placeholderClientRect = placeholder.getBoundingClientRect();
    const contentClientRect = content.getBoundingClientRect();
    return contentClientRect.height;
}

Then in my code, if I want custom placeholder height, I could do something like:

class MyOwnSticky extends Sticky {
  getPlaceholderHeight(placeholder, content) {
    // My custom height, I could just return any number I want here
    return 20;
  } 
}

...

<StickyContainer>
  <MyOwnSticky topOffset={123}>
    {() => {...}}
  </MyOwnSticky>
</StickyContainer>

I'm not sure whether that's the "best" way.
I'm trying to avoid using CSS.

Reading these 2 issues seem to be utilizing CSS:
#125
#151

If you made a PR for this feature I will bring it in