Does react-sticky work in popups/modal windows?

[rauhljoshi]

I've been trying to implement react-sticky in a popup, but it doesn't seem to work. Is this a limitation?

Pseudocode -

<Popup>
     <Content />
</Popup>

Content.js -

class Content extends React.Component {
render() {
 return (
	      <div>
	        {
	          [1,2,3,4,5,6,7,8].map(i => {
	            return (
	              <StickyContainer key={i} style={{ height: 1000, background: `hsl(${i*40}, 70%, 90%)` }}>
	                <Sticky>
	                  {
	                    ({ isSticky, wasSticky, style, distanceFromTop, distanceFromBottom, calculatedHeight }) => {
	                      return (
	                        <div style={{ ...style, height: 80, background: `hsl(${i*40}, 70%, 50%)`}}>
	                          <h2 style={{ lineHeight: '80px', padding: '0 15px', margin: 0 }}>
	                            <span className="pull-left">&lt;Sticky #{i} /&gt;</span>
	                          </h2>
	                        </div>
	                      )
	                    }
	                  }
	                </Sticky>

	                <h2 className="text-center" style={{ marginTop: 150 }}>&lt;StickyContainer #{i} /&gt;</h2>
	              </StickyContainer>
	            )
	          })
	        }
	      </div>
	    );
}

[vcarl]

Could you expand on how it's not working? If the container is the same height as the content it's wrapping, it won't have any space to be sticky. Closing, will reopen if you think this is a bug.

[maecapozzi]

@vcarl it's possible this is the same problem we were running into trying to get this working in a modal. Maybe it makes sense to reopen this, or to open a new issue?