@react-spring/parallax/dist/cjs/react-spring_parallax.production.min.cjs

```bash yarn add @react-spring/parallax ```

Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e=Object.create,t=Object.defineProperty,n=Object.getOwnPropertyDescriptor,r=Object.getOwnPropertyNames,i=Object.getPrototypeOf,a=Object.prototype.hasOwnProperty,o=(e,i,o,s)=>{if(i&&typeof i==`object`||typeof i==`function`)for(var c=r(i),l=0,u=c.length,d;l<u;l++)d=c[l],!a.call(e,d)&&d!==o&&t(e,d,{get:(e=>i[e]).bind(null,d),enumerable:!(s=n(i,d))||s.enumerable});return e},s=(n,r,a)=>(a=n==null?{}:e(i(n)),o(r||!n||!n.__esModule?t(a,`default`,{value:n,enumerable:!0}):a,n));let c=require("react");c=s(c);let l=require("@react-spring/shared"),u=require("@react-spring/web");const d=c.createContext(null);function f(e){return e?`scrollLeft`:`scrollTop`}function p(e,t){let n=e=>e.type?e.type===c.Fragment:e===c.Fragment;return c.Children.map(e,e=>n(e)?p(e.props.children,t):t(e))}const m=`translate3d(0px,0px,0px)`,h=`translate(0px,0px)`,g=c.memo(c.forwardRef(({horizontal:e,factor:t=1,offset:n=0,speed:r=0,sticky:i,...a},o)=>{let s=(0,c.useContext)(d),f=(0,l.useMemoOne)(()=>{let e;if(i)e=(i.start||0)*s.space;else{let t=Math.floor(n)*s.space,i=s.space*n+t*r;e=-(s.current*r)+i}return new u.Controller({space:i?s.space:s.space*t,translate:e})},[]),p=(0,l.useMemoOne)(()=>({horizontal:e===void 0||i?s.horizontal:e,sticky:void 0,isSticky:!1,setPosition(e,t,a=!1){if(i)h(e,t);else{let i=Math.floor(n)*e,o=e*n+i*r;f.start({translate:-(t*r)+o,config:s.config,immediate:a})}},setHeight(e,n=!1){f.start({space:i?e:e*t,config:s.config,immediate:n})}}),[]);(0,l.useOnce)(()=>{if(i){let e=i.start||0;p.sticky={start:e,end:i.end||e+1}}}),c.useImperativeHandle(o,()=>p);let m=(0,c.useRef)(void 0),h=(e,t)=>{let n=p.sticky.start*e,r=p.sticky.end*e,i=t>=n&&t<=r;if(i===p.isSticky)return;p.isSticky=i;let a=m.current;a.style.position=i?`sticky`:`absolute`,f.set({translate:i?0:t<n?n:r})};(0,l.useOnce)(()=>{if(s)return s.layers.add(p),s.update(),()=>{s.layers.delete(p),s.update()}});let g=f.springs.translate.to(p.horizontal?e=>`translate3d(${e}px,0,0)`:e=>`translate3d(0,${e}px,0)`);return c.createElement(u.a.div,{...a,ref:m,style:{position:`absolute`,top:0,bottom:0,left:0,right:0,backgroundSize:`auto`,backgroundRepeat:`no-repeat`,willChange:`transform`,[p.horizontal?`height`:`width`]:`100%`,[p.horizontal?`width`:`height`]:f.springs.space,WebkitTransform:g,msTransform:g,transform:g,...a.style}})})),_=c.memo(c.forwardRef((e,t)=>{let[n,r]=(0,c.useState)(!1),{pages:i,innerStyle:a,config:o=u.config.slow,enabled:s=!0,horizontal:g=!1,children:_,...v}=e,y=(0,c.useRef)(void 0),b=(0,c.useRef)(void 0),x=(0,l.useMemoOne)(()=>({config:o,horizontal:g,busy:!1,space:0,current:0,offset:0,controller:new u.Controller({scroll:0}),layers:new Set,container:y,content:b,update:()=>S(),scrollTo:e=>C(e),stop:()=>x.controller.stop()}),[]);(0,c.useEffect)(()=>{x.config=o},[o]),c.useImperativeHandle(t,()=>x);let S=()=>{let e=y.current;if(!e)return;x.space=e[g?`clientWidth`:`clientHeight`];let t=f(g);s?x.current=e[t]:e[t]=x.current=x.offset*x.space;let n=b.current;if(n){let e=g?`width`:`height`;n.style[e]=`${x.space*i}px`}x.layers.forEach(e=>{e.setHeight(x.space,!0),e.setPosition(x.space,x.current,!0)})},C=e=>{let t=y.current,n=f(g);x.offset=e,x.controller.set({scroll:x.current}),x.controller.stop().start({scroll:e*x.space,config:o,onChange({value:{scroll:e}}){t[n]=e}})},w=e=>{x.busy||(x.busy=!0,x.current=e.target[f(g)],l.raf.onStart(()=>{x.layers.forEach(e=>e.setPosition(x.space,x.current)),x.busy=!1}))};(0,c.useEffect)(()=>x.update()),(0,l.useOnce)(()=>{r(!0);let e=()=>{let e=()=>x.update();l.raf.onFrame(e),setTimeout(e,150)};return window.addEventListener(`resize`,e,!1),()=>window.removeEventListener(`resize`,e,!1)});let T=s?{overflowY:g?`hidden`:`scroll`,overflowX:g?`scroll`:`hidden`}:{overflowY:`hidden`,overflowX:`hidden`};return c.createElement(u.a.div,{...v,ref:y,onScroll:w,onWheel:s?x.stop:void 0,onTouchStart:s?x.stop:void 0,style:{position:`absolute`,top:0,left:0,width:`100%`,height:`100%`,...T,WebkitOverflowScrolling:`touch`,WebkitTransform:h,msTransform:h,transform:m,...v.style}},n&&c.createElement(c.Fragment,null,c.createElement(u.a.div,{ref:b,style:{overflow:`hidden`,position:`absolute`,[g?`height`:`width`]:`100%`,[g?`width`:`height`]:x.space*i,WebkitTransform:h,msTransform:h,transform:m,...e.innerStyle}},c.createElement(d.Provider,{value:x},p(_,e=>!e.props.sticky&&e))),c.createElement(d.Provider,{value:x},p(_,e=>e.props.sticky&&e))))}));exports.Parallax=_,exports.ParallaxLayer=g;