react-spring-carousel 3.0.0-beta068 → 3.0.0-beta071

package/dist/useEventsModule-538b90c9.js

@@ -0,0 +1,33 @@
+import { useRef as i, useEffect as o } from "react";
+const u = "RSC::Event";
+function v() {
+  const e = i(null);
+  function c(t) {
+    o(() => {
+      e.current || (e.current = document.createElement("div"));
+      function n(r) {
+        t(r.detail);
+      }
+      if (e.current)
+        return e.current.addEventListener(u, n, !1), () => {
+          var r;
+          (r = e.current) == null || r.removeEventListener(u, n, !1);
+        };
+    }, [t]);
+  }
+  function s(t) {
+    if (e.current) {
+      const n = new CustomEvent(u, {
+        detail: t
+      });
+      e.current.dispatchEvent(n);
+    }
+  }
+  return {
+    useListenToCustomEvent: c,
+    emitEvent: s
+  };
+}
+export {
+  v as u
+};

package/dist/useSpringCarousel.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const F=require("./useThumbsModule-57ac2128.cjs"),j=require("@react-spring/web"),c=require("react"),Ve=require("./useEventsModule-0feadbf7.cjs"),De=require("@use-gesture/react"),Be=require("resize-observer-polyfill"),k=require("screenfull");function Oe({mainCarouselWrapperRef:n,onFullScreenChange:m,handleResize:$}){const X=c.useRef(!1);c.useEffect(()=>{function h(){document.fullscreenElement&&(H(!0),m(!0),$&&$()),document.fullscreenElement||(H(!1),m(!1),$&&$())}if(k.isEnabled)return k.on("change",h),()=>{k.isEnabled&&k.off("change",h)}},[]);function H(h){X.current=h}function b(){return X.current}function w(h){k.isEnabled&&k.request(h||n.current)}function i(){k.isEnabled&&k.exit()}return{enterFullscreen:w,exitFullscreen:i,getIsFullscreen:b}}function He({items:n,init:m=!0,withThumbs:$,thumbsSlideAxis:X="x",itemsPerSlide:H=1,slideType:b="fixed",gutter:w=0,withLoop:i=!1,startEndGutter:h=0,carouselSlideAxis:s="x",disableGestures:ae=!1,draggingSlideTreshold:G,slideWhenThresholdIsReached:de=!1,freeScroll:u,enableFreeScrollDrag:xe,initialStartingPosition:L,prepareThumbsData:pe,initialActiveItem:R=0,animateWhenActiveItemChange:ye=!0,getControllerRef:A}){const E=H>n.length?n.length:H,Y=c.useRef(!1),J=c.useRef(G??0),M=c.useRef("initial"),S=c.useRef("initial"),ee=c.useRef("initial"),x=c.useRef(R),f=c.useRef(R===0),l=c.useRef(b==="fixed"&&R===n.length-1),a=c.useRef(null),p=c.useRef(null),te=c.useRef(!0),re=c.useRef(0),ne=c.useRef(0),d=c.useRef(0),Ie=c.useRef(i),Te=c.useRef(b),be=c.useRef(u),P=c.useRef(!1),K=c.useCallback(()=>i?[...n.map(e=>({...e,id:`prev-repeated-item-${e.id}`})),...n,...n.map(e=>({...e,id:`next-repeated-item-${e.id}`}))]:[...n],[n,i])(),[N,y]=j.useSpring(()=>({val:0,pause:!m,onChange:({value:e})=>{u&&a.current?(s==="x"?a.current.scrollLeft=Math.abs(e.val):a.current.scrollTop=Math.abs(e.val),_()):p.current&&(s==="x"?p.current.style.transform=`translate3d(${e.val}px, 0px,0px)`:p.current.style.transform=`translate3d(0px,${e.val}px,0px)`)}}),[u]),{emitEvent:Q,useListenToCustomEvent:U}=Ve.useEventsModule(),{thumbsFragment:Re,handleScroll:Ee}=F.useThumbsModule({withThumbs:!!$,thumbsSlideAxis:X,prepareThumbsData:pe,items:n,renderThumbFnProps:{getIsActiveItem:le,getIsPrevItem:oe,useListenToCustomEvent:U,getIsNextItem:se}}),{enterFullscreen:ge,exitFullscreen:ve,getIsFullscreen:me}=Oe({mainCarouselWrapperRef:a,handleResize:()=>Z(),onFullScreenChange:e=>{Q({eventName:"onFullscreenChange",isFullscreen:e})}});function Me(e){return b==="fixed"&&!u?{marginRight:`${e?0:w}px`,flex:`1 0 calc(100% / ${E} - ${w*(E-1)/E}px)`}:{marginRight:`${e?0:w}px`}}function g(){var r;const e=(r=a.current)==null?void 0:r.querySelector(".use-spring-carousel-item");if(!e)throw Error("No carousel items available!");return e.getBoundingClientRect()[s==="x"?"width":"height"]+w}function W({from:e,to:r,nextActiveItem:t,immediate:o=!1,slideMode:T}){S.current=T,typeof t=="number"&&(u||(x.current=t),Q({eventName:"onSlideStartChange",slideActionType:M.current,slideMode:S.current,nextItem:{startReached:f.current,endReached:l.current,index:u?-1:x.current,id:u?"":n[x.current].id}})),d.current=r,y.start({immediate:o,from:{val:e},to:{val:r},config:{...j.config.default,velocity:N.val.velocity},onRest(B){!o&&B.finished&&Q({eventName:"onSlideChange",slideActionType:M.current,slideMode:S.current,currentItem:{startReached:f.current,endReached:l.current,index:u?-1:x.current,id:u?"":n[x.current].id}})}}),$&&!o&&Ee(x.current)}function v(){var e;return i?g()*n.length:Math.round(Number((e=p.current)==null?void 0:e[s==="x"?"scrollWidth":"scrollHeight"])-p.current.getBoundingClientRect()[s==="x"?"width":"height"]-h*2)}function Ce(){const e=`calc(100% - ${h*2}px)`;return{width:s==="x"?e:"100%",height:s==="y"?e:"100%"}}function ue(){var r;const e=(r=p.current)==null?void 0:r.querySelector(".use-spring-carousel-item");if(!e)throw Error("No carousel items available!");return e.getBoundingClientRect()[s==="x"?"width":"height"]+w}function ce(e){const r=s==="x"?"left":"top",t=p.current;t&&(i?(t.style.top="0px",t.style.left="0px",t.style[r]=`-${e-h}px`,f.current=!1,l.current=!1):(t.style.left="0px",t.style.top="0px"))}function Z(e=!1){if(p.current&&e&&(p.current.style.transform="translate3d(0px, 0px,0px)",p.current.style.left="0",p.current.style.top="0"),b==="fixed"&&ce(L==="center"?ue()*n.length-g()*Math.round((E-1)/2):L==="end"?ue()*n.length-g()*Math.round(E-1):ue()*n.length),b==="fluid"){if(l.current&&v()!==Math.abs(d.current)&&!i){const r=-v();d.current=r,y.start({immediate:!0,val:d.current});return}if(Math.abs(d.current)>0&&v()!==Math.abs(d.current)&&!i&&!u&&ee.current==="backward"){const r=re.current-v(),t=d.current+r;return y.start({immediate:!0,val:t}),()=>{d.current=t}}return}if(!u&&b==="fixed"){const r=-(g()*x.current);if(Math.abs(r)>v()&&!i){const t=-v();l.current=!0,d.current=t,y.start({immediate:!0,val:d.current})}else d.current=r,y.start({immediate:!0,val:r});setTimeout(()=>{Y.current=!1},0)}}function C(){return u&&a.current?a.current[s==="x"?"scrollLeft":"scrollTop"]:N.val.get()}function z(e,r){if(u&&e==="next"){const t=d.current+g();return t>v()?v():t}if(u&&e==="prev"){const t=d.current-g();return t<0?0:t}return e==="next"?typeof r=="number"?-(r*g()):d.current-g():typeof r=="number"?-(r*g()):d.current+g()}function q({type:e,index:r,immediate:t}){if(!m||P.current||f.current&&!i)return;l.current&&(ee.current="backward"),M.current="prev",l.current=!1;const o=typeof r=="number"?r:x.current-1;if(u&&_(),!i){const T=u?z("prev",r)-g()/3<0:z("prev",r)+g()/3>0;if(f.current)return;if(T){f.current=!0,l.current=!1,W({slideMode:e,from:C(),to:0,nextActiveItem:0,immediate:t});return}}if(i&&(f.current||o<0)){f.current=!1,l.current=!0,W({slideMode:e,from:C()-g()*n.length,to:-(g()*n.length)+g(),nextActiveItem:n.length-1,immediate:t});return}o===0&&(f.current=!0),(o===n.length-1||o===-1)&&(l.current=!0),W({slideMode:e,from:C(),to:z("prev",r),nextActiveItem:o,immediate:t})}function V({type:e,index:r,immediate:t}){if(!m||P.current||l.current&&!i)return;f.current&&(ee.current="forward"),M.current="next",f.current=!1;const o=r||x.current+1;if(u&&_(),!i){const T=Math.abs(z("next",r))>v()-g()/3;if(l.current)return;if(T){f.current=!1,l.current=!0,W({slideMode:e,from:C(),to:u?v():-v(),nextActiveItem:o,immediate:t});return}}if(i&&(l.current||o>n.length-1)){l.current=!1,f.current=!0,W({slideMode:e,from:C()+g()*n.length,to:0,nextActiveItem:0,immediate:t});return}o===0&&(f.current=!0),o===n.length-1&&(l.current=!0),W({slideMode:e,from:C(),to:z("next",r),nextActiveItem:o,immediate:t})}function we(){G?J.current=G:J.current=Math.floor(g()/2/2)}function he(){!te.current&&p.current&&(re.current=v(),Ie.current=i,Te.current=b,be.current=u,ne.current=window.innerWidth,d.current=0,ie({id:0,immediate:!0,shouldReset:!0}),we(),Z())}const Fe=m&&!ae&&!u||!!u&&!!xe,ke=De.useDrag(e=>{const r=e.dragging,t=e.offset[s==="x"?0:1],o=e.movement[s==="x"?0:1],T=e.direction[s==="x"?0:1],B=o>J.current,O=o<-J.current,qe=v();if(r){if(T>0?M.current="prev":M.current="next",Q({...e,eventName:"onDrag",slideActionType:M.current}),u){if(t>0){y.start({from:{val:C()},to:{val:0},config:{velocity:e.velocity,friction:50,tension:1e3}}),e.cancel();return}y.start({from:{val:C()},to:{val:-t},config:{velocity:e.velocity,friction:50,tension:1e3}});return}y.start({val:t,config:{velocity:e.velocity,friction:50,tension:1e3}}),de&&O?(V({type:"drag"}),e.cancel()):de&&B&&(q({type:"drag"}),e.cancel()),qe-Math.abs(t)<-(g()*2)&&e.cancel();return}if(e.last&&u&&t>0){y.start({from:{val:C()},to:{val:0},config:{velocity:e.velocity,friction:50,tension:1e3}});return}e.last&&!e.canceled&&u&&(M.current==="prev"&&q({type:"drag"}),M.current==="next"&&V({type:"drag"})),e.last&&!e.canceled&&!u&&(O?!i&&l.current?y.start({val:-v(),config:{...j.config.default,velocity:e.velocity}}):V({type:"drag"}):B?!i&&f.current?y.start({val:0,config:{...j.config.default,velocity:e.velocity}}):q({type:"drag"}):y.start({val:d.current,config:{...j.config.default,velocity:e.velocity}})),e.last&&e.canceled&&y.start({val:d.current,config:{...j.config.default,velocity:e.velocity}})},{enabled:Fe,axis:s,from:()=>u&&a.current?[-a.current.scrollLeft,-a.current.scrollTop]:s==="x"?[N.val.get(),N.val.get()]:[N.val.get(),N.val.get()]});function $e(){return u?s==="x"?{overflowX:"auto"}:{overflowY:"auto"}:{}}function _(){a.current&&(d.current=a.current[s==="x"?"scrollLeft":"scrollTop"],a.current[s==="x"?"scrollLeft":"scrollTop"]===0&&(f.current=!0,l.current=!1),a.current[s==="x"?"scrollLeft":"scrollTop"]>0&&a.current[s==="x"?"scrollLeft":"scrollTop"]<v()&&(f.current=!1,l.current=!1),a.current[s==="x"?"scrollLeft":"scrollTop"]===v()&&(f.current=!1,l.current=!0))}function Ne(){return u?{onWheel(){N.val.stop(),_()}}:{}}function D(e,r){let t=0;if(typeof e=="string"?t=n.findIndex(o=>o.id===e):t=e,t<0||t>=n.length){if(r)throw new Error(r);console.error(`The item doesn't exist; check that the id provided - ${e} - is correct.`),t=-1}return t}function ie({id:e,immediate:r,shouldReset:t,type:o}){if(!m||P.current)return;f.current=!1,l.current=!1;const T=D(e,"The item you want to slide to doesn't exist; check the provided id.");if(T===x.current&&!t)return;const B=D(n[x.current].id),O=D(n[T].id);O>B?V({type:o||t?"initial":"click",index:O,immediate:r}):q({type:o||t?"initial":"click",index:O,immediate:r})}function se(e){const r=D(e,"The item doesn't exist; check the provided id."),t=x.current;return i&&t===n.length-1?r===0:r===t+1}function oe(e){const r=D(e,"The item doesn't exist; check the provided id."),t=x.current;return i&&t===0?r===n.length-1:r===t-1}function le(e){return D(e,"The item you want to check doesn't exist; check the provided id.")===x.current}function je(){return ae?"unset":s==="x"?"pan-y":"pan-x"}const I=u?{useListenToCustomEvent:U,enterFullscreen:ge,exitFullscreen:ve,getIsFullscreen:me,slideToPrevItem:(e=!0)=>{q({type:"click",immediate:!e})},slideToNextItem:(e=!0)=>{V({type:"click",immediate:!e})}}:{useListenToCustomEvent:U,enterFullscreen:ge,exitFullscreen:ve,getIsFullscreen:me,slideToPrevItem:(e=!0)=>{q({type:"click",immediate:!e})},slideToNextItem:(e=!0)=>{V({type:"click",immediate:!e})},slideToItem:(e,r=!0)=>{ie({id:e,immediate:!r})},getIsNextItem:se,getIsPrevItem:oe,getIsActiveItem:le};j.useIsomorphicLayoutEffect(()=>{p.current&&m&&(Y.current=!0,he())},[m]),c.useEffect(()=>{x.current!==R&&ie({id:R,immediate:!ye})},[R]),c.useEffect(()=>{if(m){if(R>n.length-1)throw new Error(`initialActiveItem (${R}) is greater than the total quantity available items (${n.length}).`);E>n.length&&console.warn(`itemsPerSlide (${E}) is greater than the total quantity available items (${n.length}). Fallback to ${n.length})`)}},[R,n.length,E,m]),c.useEffect(()=>{ne.current=window.innerWidth},[]),c.useEffect(()=>{m&&(Y.current=!0,he())},[L,E,h,w,m,i]),c.useEffect(()=>{if(!m)return;function e(){document.hidden?P.current=!0:P.current=!1}return document.addEventListener("visibilitychange",e),()=>{document.removeEventListener("visibilitychange",e)}},[m]),c.useEffect(()=>{if(a.current){let e;const r=new Be(()=>{if(te.current){te.current=!1;return}if(!P.current&&!Y.current){ne.current=window.innerWidth;const t=Z();window.clearTimeout(e),e=setTimeout(()=>{re.current=v(),typeof t=="function"&&t()},100)}});return r.observe(a.current),()=>{r.disconnect()}}},[Z,v]),c.useEffect(()=>{A&&A({slideToNextItem:I.slideToNextItem,slideToPrevItem:I.slideToPrevItem,slideToItem:I==null?void 0:I.slideToItem})},[A,I.slideToItem,I.slideToNextItem,I.slideToPrevItem]);const Pe=F.jsxRuntimeExports.jsx(fe.Provider,{value:I,children:Re}),We=F.jsxRuntimeExports.jsx(fe.Provider,{value:I,children:F.jsxRuntimeExports.jsx("div",{className:"use-spring-carousel-main-wrapper",ref:a,...Ne(),style:{display:"flex",position:"relative",width:"100%",height:"100%",...$e()},children:F.jsxRuntimeExports.jsxs("div",{className:"use-spring-carousel-track-wrapper",ref:p,...ke(),style:{position:"relative",display:"flex",flexDirection:s==="x"?"row":"column",touchAction:je(),...Ce()},children:[(u||!i)&&h?F.jsxRuntimeExports.jsx("div",{style:{flexShrink:0,width:h}}):null,K.map((e,r)=>F.jsxRuntimeExports.jsx("div",{className:"use-spring-carousel-item","data-testid":"use-spring-carousel-item-wrapper",style:{display:"flex",position:"relative",flex:"1",...Me(r===K.findIndex(t=>t.id===K[K.length-1].id))},children:typeof e.renderItem=="function"?e.renderItem({getIsActiveItem:le,getIsNextItem:se,getIsPrevItem:oe,useListenToCustomEvent:U}):e.renderItem},`${e.id}-${r}`)),(u||!i)&&h?F.jsxRuntimeExports.jsx("div",{style:{flexShrink:0,width:h}}):null]})})});return{...I,carouselFragment:We,thumbsFragment:Pe}}const fe=c.createContext(void 0);function ze(){const n=c.useContext(fe);if(!n)throw new Error("useSpringCarouselContext must be used within the carousel.");return n}exports.useSpringCarousel=He;exports.useSpringCarouselContext=ze;