react-spring-carousel 3.0.0-beta-2.0.4 → 3.0.0-beta-2.0.42

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (8) hide show
  1. package/dist/index.d.ts +1 -0
  2. package/dist/index.es.js +707 -618
  3. package/dist/index.umd.js +17 -17
  4. package/dist/types.d.ts +4 -0
  5. package/dist/useSpringCarousel.d.ts +0 -2
  6. package/dist/useSpringScroll.d.ts +11 -0
  7. package/dist/utils.d.ts +6 -0
  8. package/package.json +33 -32
package/dist/index.umd.js CHANGED
@@ -1,4 +1,4 @@
1
- (function(D,O){typeof exports=="object"&&typeof module<"u"?O(exports,require("react/jsx-runtime"),require("@react-spring/web"),require("react")):typeof define=="function"&&define.amd?define(["exports","react/jsx-runtime","@react-spring/web","react"],O):(D=typeof globalThis<"u"?globalThis:D||self,O(D["react-spring-carousel"]={},D["react/jsx-runtime"],D["@react-spring/web"],D.React))})(this,function(D,O,ke,m){"use strict";function De(r,e,t){return Math.max(e,Math.min(r,t))}const v={toVector(r,e){return r===void 0&&(r=e),Array.isArray(r)?r:[r,r]},add(r,e){return[r[0]+e[0],r[1]+e[1]]},sub(r,e){return[r[0]-e[0],r[1]-e[1]]},addTo(r,e){r[0]+=e[0],r[1]+=e[1]},subTo(r,e){r[0]-=e[0],r[1]-=e[1]}};function te(r,e,t){return e===0||Math.abs(e)===1/0?Math.pow(r,t*5):r*e*t/(e+t*r)}function re(r,e,t,n=.15){return n===0?De(r,e,t):r<e?-te(e-r,t-e,n)+e:r>t?+te(r-t,t-e,n)+t:r}function Ce(r,[e,t],[n,s]){const[[o,a],[u,h]]=r;return[re(e,o,a,n),re(t,u,h,s)]}function Pe(r,e){if(typeof r!="object"||r===null)return r;var t=r[Symbol.toPrimitive];if(t!==void 0){var n=t.call(r,e);if(typeof n!="object")return n;throw new TypeError("@@toPrimitive must return a primitive value.")}return(e==="string"?String:Number)(r)}function $e(r){var e=Pe(r,"string");return typeof e=="symbol"?e:String(e)}function _(r,e,t){return e=$e(e),e in r?Object.defineProperty(r,e,{value:t,enumerable:!0,configurable:!0,writable:!0}):r[e]=t,r}function ne(r,e){var t=Object.keys(r);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(r);e&&(n=n.filter(function(s){return Object.getOwnPropertyDescriptor(r,s).enumerable})),t.push.apply(t,n)}return t}function d(r){for(var e=1;e<arguments.length;e++){var t=arguments[e]!=null?arguments[e]:{};e%2?ne(Object(t),!0).forEach(function(n){_(r,n,t[n])}):Object.getOwnPropertyDescriptors?Object.defineProperties(r,Object.getOwnPropertyDescriptors(t)):ne(Object(t)).forEach(function(n){Object.defineProperty(r,n,Object.getOwnPropertyDescriptor(t,n))})}return r}const se={pointer:{start:"down",change:"move",end:"up"},mouse:{start:"down",change:"move",end:"up"},touch:{start:"start",change:"move",end:"end"},gesture:{start:"start",change:"change",end:"end"}};function ie(r){return r?r[0].toUpperCase()+r.slice(1):""}const Oe=["enter","leave"];function Ae(r=!1,e){return r&&!Oe.includes(e)}function Ne(r,e="",t=!1){const n=se[r],s=n&&n[e]||e;return"on"+ie(r)+ie(s)+(Ae(t,s)?"Capture":"")}const Me=["gotpointercapture","lostpointercapture"];function Ve(r){let e=r.substring(2).toLowerCase();const t=!!~e.indexOf("passive");t&&(e=e.replace("passive",""));const n=Me.includes(e)?"capturecapture":"capture",s=!!~e.indexOf(n);return s&&(e=e.replace("capture","")),{device:e,capture:s,passive:t}}function Le(r,e=""){const t=se[r],n=t&&t[e]||e;return r+n}function B(r){return"touches"in r}function oe(r){return B(r)?"touch":"pointerType"in r?r.pointerType:"mouse"}function Re(r){return Array.from(r.touches).filter(e=>{var t,n;return e.target===r.currentTarget||((t=r.currentTarget)===null||t===void 0||(n=t.contains)===null||n===void 0?void 0:n.call(t,e.target))})}function je(r){return r.type==="touchend"||r.type==="touchcancel"?r.changedTouches:r.targetTouches}function ae(r){return B(r)?je(r)[0]:r}function Ue(r){return Re(r).map(e=>e.identifier)}function W(r){const e=ae(r);return B(r)?e.identifier:e.pointerId}function ce(r){const e=ae(r);return[e.clientX,e.clientY]}function Ke(r){const e={};if("buttons"in r&&(e.buttons=r.buttons),"shiftKey"in r){const{shiftKey:t,altKey:n,metaKey:s,ctrlKey:o}=r;Object.assign(e,{shiftKey:t,altKey:n,metaKey:s,ctrlKey:o})}return e}function z(r,...e){return typeof r=="function"?r(...e):r}function Be(){}function ze(...r){return r.length===0?Be:r.length===1?r[0]:function(){let e;for(const t of r)e=t.apply(this,arguments)||e;return e}}function ue(r,e){return Object.assign({},e,r||{})}const Ge=32;class Ye{constructor(e,t,n){this.ctrl=e,this.args=t,this.key=n,this.state||(this.state={},this.computeValues([0,0]),this.computeInitial(),this.init&&this.init(),this.reset())}get state(){return this.ctrl.state[this.key]}set state(e){this.ctrl.state[this.key]=e}get shared(){return this.ctrl.state.shared}get eventStore(){return this.ctrl.gestureEventStores[this.key]}get timeoutStore(){return this.ctrl.gestureTimeoutStores[this.key]}get config(){return this.ctrl.config[this.key]}get sharedConfig(){return this.ctrl.config.shared}get handler(){return this.ctrl.handlers[this.key]}reset(){const{state:e,shared:t,ingKey:n,args:s}=this;t[n]=e._active=e.active=e._blocked=e._force=!1,e._step=[!1,!1],e.intentional=!1,e._movement=[0,0],e._distance=[0,0],e._direction=[0,0],e._delta=[0,0],e._bounds=[[-1/0,1/0],[-1/0,1/0]],e.args=s,e.axis=void 0,e.memo=void 0,e.elapsedTime=e.timeDelta=0,e.direction=[0,0],e.distance=[0,0],e.overflow=[0,0],e._movementBound=[!1,!1],e.velocity=[0,0],e.movement=[0,0],e.delta=[0,0],e.timeStamp=0}start(e){const t=this.state,n=this.config;t._active||(this.reset(),this.computeInitial(),t._active=!0,t.target=e.target,t.currentTarget=e.currentTarget,t.lastOffset=n.from?z(n.from,t):t.offset,t.offset=t.lastOffset,t.startTime=t.timeStamp=e.timeStamp)}computeValues(e){const t=this.state;t._values=e,t.values=this.config.transform(e)}computeInitial(){const e=this.state;e._initial=e._values,e.initial=e.values}compute(e){const{state:t,config:n,shared:s}=this;t.args=this.args;let o=0;if(e&&(t.event=e,n.preventDefault&&e.cancelable&&t.event.preventDefault(),t.type=e.type,s.touches=this.ctrl.pointerIds.size||this.ctrl.touchIds.size,s.locked=!!document.pointerLockElement,Object.assign(s,Ke(e)),s.down=s.pressed=s.buttons%2===1||s.touches>0,o=e.timeStamp-t.timeStamp,t.timeStamp=e.timeStamp,t.elapsedTime=t.timeStamp-t.startTime),t._active){const l=t._delta.map(Math.abs);v.addTo(t._distance,l)}this.axisIntent&&this.axisIntent(e);const[a,u]=t._movement,[h,p]=n.threshold,{_step:c,values:w}=t;if(n.hasCustomTransform?(c[0]===!1&&(c[0]=Math.abs(a)>=h&&w[0]),c[1]===!1&&(c[1]=Math.abs(u)>=p&&w[1])):(c[0]===!1&&(c[0]=Math.abs(a)>=h&&Math.sign(a)*h),c[1]===!1&&(c[1]=Math.abs(u)>=p&&Math.sign(u)*p)),t.intentional=c[0]!==!1||c[1]!==!1,!t.intentional)return;const y=[0,0];if(n.hasCustomTransform){const[l,K]=w;y[0]=c[0]!==!1?l-c[0]:0,y[1]=c[1]!==!1?K-c[1]:0}else y[0]=c[0]!==!1?a-c[0]:0,y[1]=c[1]!==!1?u-c[1]:0;this.restrictToAxis&&!t._blocked&&this.restrictToAxis(y);const M=t.offset,C=t._active&&!t._blocked||t.active;C&&(t.first=t._active&&!t.active,t.last=!t._active&&t.active,t.active=s[this.ingKey]=t._active,e&&(t.first&&("bounds"in n&&(t._bounds=z(n.bounds,t)),this.setup&&this.setup()),t.movement=y,this.computeOffset()));const[T,A]=t.offset,[[V,k],[P,$]]=t._bounds;t.overflow=[T<V?-1:T>k?1:0,A<P?-1:A>$?1:0],t._movementBound[0]=t.overflow[0]?t._movementBound[0]===!1?t._movement[0]:t._movementBound[0]:!1,t._movementBound[1]=t.overflow[1]?t._movementBound[1]===!1?t._movement[1]:t._movementBound[1]:!1;const U=t._active?n.rubberband||[0,0]:[0,0];if(t.offset=Ce(t._bounds,t.offset,U),t.delta=v.sub(t.offset,M),this.computeMovement(),C&&(!t.last||o>Ge)){t.delta=v.sub(t.offset,M);const l=t.delta.map(Math.abs);v.addTo(t.distance,l),t.direction=t.delta.map(Math.sign),t._direction=t._delta.map(Math.sign),!t.first&&o>0&&(t.velocity=[l[0]/o,l[1]/o],t.timeDelta=o)}}emit(){const e=this.state,t=this.shared,n=this.config;if(e._active||this.clean(),(e._blocked||!e.intentional)&&!e._force&&!n.triggerAllEvents)return;const s=this.handler(d(d(d({},t),e),{},{[this.aliasKey]:e.values}));s!==void 0&&(e.memo=s)}clean(){this.eventStore.clean(),this.timeoutStore.clean()}}function Fe([r,e],t){const n=Math.abs(r),s=Math.abs(e);if(n>s&&n>t)return"x";if(s>n&&s>t)return"y"}class We extends Ye{constructor(...e){super(...e),_(this,"aliasKey","xy")}reset(){super.reset(),this.state.axis=void 0}init(){this.state.offset=[0,0],this.state.lastOffset=[0,0]}computeOffset(){this.state.offset=v.add(this.state.lastOffset,this.state.movement)}computeMovement(){this.state.movement=v.sub(this.state.offset,this.state.lastOffset)}axisIntent(e){const t=this.state,n=this.config;if(!t.axis&&e){const s=typeof n.axisThreshold=="object"?n.axisThreshold[oe(e)]:n.axisThreshold;t.axis=Fe(t._movement,s)}t._blocked=(n.lockDirection||!!n.axis)&&!t.axis||!!n.axis&&n.axis!==t.axis}restrictToAxis(e){if(this.config.axis||this.config.lockDirection)switch(this.state.axis){case"x":e[1]=0;break;case"y":e[0]=0;break}}}const fe=r=>r,le=.15,H={enabled(r=!0){return r},eventOptions(r,e,t){return d(d({},t.shared.eventOptions),r)},preventDefault(r=!1){return r},triggerAllEvents(r=!1){return r},rubberband(r=0){switch(r){case!0:return[le,le];case!1:return[0,0];default:return v.toVector(r)}},from(r){if(typeof r=="function")return r;if(r!=null)return v.toVector(r)},transform(r,e,t){const n=r||t.shared.transform;if(this.hasCustomTransform=!!n,process.env.NODE_ENV==="development"){const s=n||fe;return o=>{const a=s(o);return(!isFinite(a[0])||!isFinite(a[1]))&&console.warn(`[@use-gesture]: config.transform() must produce a valid result, but it was: [${a[0]},${[1]}]`),a}}return n||fe},threshold(r){return v.toVector(r,0)}};process.env.NODE_ENV==="development"&&Object.assign(H,{domTarget(r){if(r!==void 0)throw Error("[@use-gesture]: `domTarget` option has been renamed to `target`.");return NaN},lockDirection(r){if(r!==void 0)throw Error("[@use-gesture]: `lockDirection` option has been merged with `axis`. Use it as in `{ axis: 'lock' }`");return NaN},initial(r){if(r!==void 0)throw Error("[@use-gesture]: `initial` option has been renamed to `from`.");return NaN}});const He=0,R=d(d({},H),{},{axis(r,e,{axis:t}){if(this.lockDirection=t==="lock",!this.lockDirection)return t},axisThreshold(r=He){return r},bounds(r={}){if(typeof r=="function")return o=>R.bounds(r(o));if("current"in r)return()=>r.current;if(typeof HTMLElement=="function"&&r instanceof HTMLElement)return r;const{left:e=-1/0,right:t=1/0,top:n=-1/0,bottom:s=1/0}=r;return[[e,t],[n,s]]}}),de={ArrowRight:(r,e=1)=>[r*e,0],ArrowLeft:(r,e=1)=>[-1*r*e,0],ArrowUp:(r,e=1)=>[0,-1*r*e],ArrowDown:(r,e=1)=>[0,r*e]};class Xe extends We{constructor(...e){super(...e),_(this,"ingKey","dragging")}reset(){super.reset();const e=this.state;e._pointerId=void 0,e._pointerActive=!1,e._keyboardActive=!1,e._preventScroll=!1,e._delayed=!1,e.swipe=[0,0],e.tap=!1,e.canceled=!1,e.cancel=this.cancel.bind(this)}setup(){const e=this.state;if(e._bounds instanceof HTMLElement){const t=e._bounds.getBoundingClientRect(),n=e.currentTarget.getBoundingClientRect(),s={left:t.left-n.left+e.offset[0],right:t.right-n.right+e.offset[0],top:t.top-n.top+e.offset[1],bottom:t.bottom-n.bottom+e.offset[1]};e._bounds=R.bounds(s)}}cancel(){const e=this.state;e.canceled||(e.canceled=!0,e._active=!1,setTimeout(()=>{this.compute(),this.emit()},0))}setActive(){this.state._active=this.state._pointerActive||this.state._keyboardActive}clean(){this.pointerClean(),this.state._pointerActive=!1,this.state._keyboardActive=!1,super.clean()}pointerDown(e){const t=this.config,n=this.state;if(e.buttons!=null&&(Array.isArray(t.pointerButtons)?!t.pointerButtons.includes(e.buttons):t.pointerButtons!==-1&&t.pointerButtons!==e.buttons))return;const s=this.ctrl.setEventIds(e);t.pointerCapture&&e.target.setPointerCapture(e.pointerId),!(s&&s.size>1&&n._pointerActive)&&(this.start(e),this.setupPointer(e),n._pointerId=W(e),n._pointerActive=!0,this.computeValues(ce(e)),this.computeInitial(),t.preventScrollAxis&&oe(e)!=="mouse"?(n._active=!1,this.setupScrollPrevention(e)):t.delay>0?(this.setupDelayTrigger(e),t.triggerAllEvents&&(this.compute(e),this.emit())):this.startPointerDrag(e))}startPointerDrag(e){const t=this.state;t._active=!0,t._preventScroll=!0,t._delayed=!1,this.compute(e),this.emit()}pointerMove(e){const t=this.state,n=this.config;if(!t._pointerActive)return;const s=W(e);if(t._pointerId!==void 0&&s!==t._pointerId)return;const o=ce(e);if(document.pointerLockElement===e.target?t._delta=[e.movementX,e.movementY]:(t._delta=v.sub(o,t._values),this.computeValues(o)),v.addTo(t._movement,t._delta),this.compute(e),t._delayed&&t.intentional){this.timeoutStore.remove("dragDelay"),t.active=!1,this.startPointerDrag(e);return}if(n.preventScrollAxis&&!t._preventScroll)if(t.axis)if(t.axis===n.preventScrollAxis||n.preventScrollAxis==="xy"){t._active=!1,this.clean();return}else{this.timeoutStore.remove("startPointerDrag"),this.startPointerDrag(e);return}else return;this.emit()}pointerUp(e){this.ctrl.setEventIds(e);try{this.config.pointerCapture&&e.target.hasPointerCapture(e.pointerId)&&e.target.releasePointerCapture(e.pointerId)}catch{process.env.NODE_ENV==="development"&&console.warn("[@use-gesture]: If you see this message, it's likely that you're using an outdated version of `@react-three/fiber`. \n\nPlease upgrade to the latest version.")}const t=this.state,n=this.config;if(!t._active||!t._pointerActive)return;const s=W(e);if(t._pointerId!==void 0&&s!==t._pointerId)return;this.state._pointerActive=!1,this.setActive(),this.compute(e);const[o,a]=t._distance;if(t.tap=o<=n.tapsThreshold&&a<=n.tapsThreshold,t.tap&&n.filterTaps)t._force=!0;else{const[u,h]=t._delta,[p,c]=t._movement,[w,y]=n.swipe.velocity,[M,C]=n.swipe.distance,T=n.swipe.duration;if(t.elapsedTime<T){const A=Math.abs(u/t.timeDelta),V=Math.abs(h/t.timeDelta);A>w&&Math.abs(p)>M&&(t.swipe[0]=Math.sign(u)),V>y&&Math.abs(c)>C&&(t.swipe[1]=Math.sign(h))}}this.emit()}pointerClick(e){!this.state.tap&&e.detail>0&&(e.preventDefault(),e.stopPropagation())}setupPointer(e){const t=this.config,n=t.device;if(process.env.NODE_ENV==="development")try{if(n==="pointer"&&t.preventScrollDelay===void 0){const s="uv"in e?e.sourceEvent.currentTarget:e.currentTarget;window.getComputedStyle(s).touchAction==="auto"&&console.warn("[@use-gesture]: The drag target has its `touch-action` style property set to `auto`. It is recommended to add `touch-action: 'none'` so that the drag gesture behaves correctly on touch-enabled devices. For more information read this: https://use-gesture.netlify.app/docs/extras/#touch-action.\n\nThis message will only show in development mode. It won't appear in production. If this is intended, you can ignore it.",s)}}catch{}t.pointerLock&&e.currentTarget.requestPointerLock(),t.pointerCapture||(this.eventStore.add(this.sharedConfig.window,n,"change",this.pointerMove.bind(this)),this.eventStore.add(this.sharedConfig.window,n,"end",this.pointerUp.bind(this)),this.eventStore.add(this.sharedConfig.window,n,"cancel",this.pointerUp.bind(this)))}pointerClean(){this.config.pointerLock&&document.pointerLockElement===this.state.currentTarget&&document.exitPointerLock()}preventScroll(e){this.state._preventScroll&&e.cancelable&&e.preventDefault()}setupScrollPrevention(e){this.state._preventScroll=!1,qe(e);const t=this.eventStore.add(this.sharedConfig.window,"touch","change",this.preventScroll.bind(this),{passive:!1});this.eventStore.add(this.sharedConfig.window,"touch","end",t),this.eventStore.add(this.sharedConfig.window,"touch","cancel",t),this.timeoutStore.add("startPointerDrag",this.startPointerDrag.bind(this),this.config.preventScrollDelay,e)}setupDelayTrigger(e){this.state._delayed=!0,this.timeoutStore.add("dragDelay",()=>{this.state._step=[0,0],this.startPointerDrag(e)},this.config.delay)}keyDown(e){const t=de[e.key];if(t){const n=this.state,s=e.shiftKey?10:e.altKey?.1:1;this.start(e),n._delta=t(this.config.keyboardDisplacement,s),n._keyboardActive=!0,v.addTo(n._movement,n._delta),this.compute(e),this.emit()}}keyUp(e){e.key in de&&(this.state._keyboardActive=!1,this.setActive(),this.compute(e),this.emit())}bind(e){const t=this.config.device;e(t,"start",this.pointerDown.bind(this)),this.config.pointerCapture&&(e(t,"change",this.pointerMove.bind(this)),e(t,"end",this.pointerUp.bind(this)),e(t,"cancel",this.pointerUp.bind(this)),e("lostPointerCapture","",this.pointerUp.bind(this))),this.config.keys&&(e("key","down",this.keyDown.bind(this)),e("key","up",this.keyUp.bind(this))),this.config.filterTaps&&e("click","",this.pointerClick.bind(this),{capture:!0,passive:!1})}}function qe(r){"persist"in r&&typeof r.persist=="function"&&r.persist()}const j=typeof window<"u"&&window.document&&window.document.createElement;function he(){return j&&"ontouchstart"in window}function Je(){return he()||j&&window.navigator.maxTouchPoints>1}function Qe(){return j&&"onpointerdown"in window}function Ze(){return j&&"exitPointerLock"in window.document}function et(){try{return"constructor"in GestureEvent}catch{return!1}}const I={isBrowser:j,gesture:et(),touch:he(),touchscreen:Je(),pointer:Qe(),pointerLock:Ze()},tt=250,rt=180,nt=.5,st=50,it=250,ot=10,pe={mouse:0,touch:0,pen:8},me=d(d({},R),{},{device(r,e,{pointer:{touch:t=!1,lock:n=!1,mouse:s=!1}={}}){return this.pointerLock=n&&I.pointerLock,I.touch&&t?"touch":this.pointerLock?"mouse":I.pointer&&!s?"pointer":I.touch?"touch":"mouse"},preventScrollAxis(r,e,{preventScroll:t}){if(this.preventScrollDelay=typeof t=="number"?t:t||t===void 0&&r?tt:void 0,!(!I.touchscreen||t===!1))return r||(t!==void 0?"y":void 0)},pointerCapture(r,e,{pointer:{capture:t=!0,buttons:n=1,keys:s=!0}={}}){return this.pointerButtons=n,this.keys=s,!this.pointerLock&&this.device==="pointer"&&t},threshold(r,e,{filterTaps:t=!1,tapsThreshold:n=3,axis:s=void 0}){const o=v.toVector(r,t?n:s?1:0);return this.filterTaps=t,this.tapsThreshold=n,o},swipe({velocity:r=nt,distance:e=st,duration:t=it}={}){return{velocity:this.transform(v.toVector(r)),distance:this.transform(v.toVector(e)),duration:t}},delay(r=0){switch(r){case!0:return rt;case!1:return 0;default:return r}},axisThreshold(r){return r?d(d({},pe),r):pe},keyboardDisplacement(r=ot){return r}});process.env.NODE_ENV==="development"&&Object.assign(me,{useTouch(r){if(r!==void 0)throw Error("[@use-gesture]: `useTouch` option has been renamed to `pointer.touch`. Use it as in `{ pointer: { touch: true } }`.");return NaN},experimental_preventWindowScrollY(r){if(r!==void 0)throw Error("[@use-gesture]: `experimental_preventWindowScrollY` option has been renamed to `preventScroll`.");return NaN},swipeVelocity(r){if(r!==void 0)throw Error("[@use-gesture]: `swipeVelocity` option has been renamed to `swipe.velocity`. Use it as in `{ swipe: { velocity: 0.5 } }`.");return NaN},swipeDistance(r){if(r!==void 0)throw Error("[@use-gesture]: `swipeDistance` option has been renamed to `swipe.distance`. Use it as in `{ swipe: { distance: 50 } }`.");return NaN},swipeDuration(r){if(r!==void 0)throw Error("[@use-gesture]: `swipeDuration` option has been renamed to `swipe.duration`. Use it as in `{ swipe: { duration: 250 } }`.");return NaN}}),d(d({},H),{},{device(r,e,{shared:t,pointer:{touch:n=!1}={}}){if(t.target&&!I.touch&&I.gesture)return"gesture";if(I.touch&&n)return"touch";if(I.touchscreen){if(I.pointer)return"pointer";if(I.touch)return"touch"}},bounds(r,e,{scaleBounds:t={},angleBounds:n={}}){const s=a=>{const u=ue(z(t,a),{min:-1/0,max:1/0});return[u.min,u.max]},o=a=>{const u=ue(z(n,a),{min:-1/0,max:1/0});return[u.min,u.max]};return typeof t!="function"&&typeof n!="function"?[s(),o()]:a=>[s(a),o(a)]},threshold(r,e,t){return this.lockDirection=t.axis==="lock",v.toVector(r,this.lockDirection?[.1,3]:0)},modifierKey(r){return r===void 0?"ctrlKey":r},pinchOnWheel(r=!0){return r}}),d(d({},R),{},{mouseOnly:(r=!0)=>r}),d(d({},R),{},{mouseOnly:(r=!0)=>r});const ge=new Map,X=new Map;function at(r){ge.set(r.key,r.engine),X.set(r.key,r.resolver)}const ct={key:"drag",engine:Xe,resolver:me};function ut(r,e){if(r==null)return{};var t={},n=Object.keys(r),s,o;for(o=0;o<n.length;o++)s=n[o],!(e.indexOf(s)>=0)&&(t[s]=r[s]);return t}function ft(r,e){if(r==null)return{};var t=ut(r,e),n,s;if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(r);for(s=0;s<o.length;s++)n=o[s],!(e.indexOf(n)>=0)&&Object.prototype.propertyIsEnumerable.call(r,n)&&(t[n]=r[n])}return t}const lt={target(r){if(r)return()=>"current"in r?r.current:r},enabled(r=!0){return r},window(r=I.isBrowser?window:void 0){return r},eventOptions({passive:r=!0,capture:e=!1}={}){return{passive:r,capture:e}},transform(r){return r}},dt=["target","eventOptions","window","enabled","transform"];function G(r={},e){const t={};for(const[n,s]of Object.entries(e))switch(typeof s){case"function":if(process.env.NODE_ENV==="development"){const o=s.call(t,r[n],n,r);Number.isNaN(o)||(t[n]=o)}else t[n]=s.call(t,r[n],n,r);break;case"object":t[n]=G(r[n],s);break;case"boolean":s&&(t[n]=r[n]);break}return t}function ht(r,e,t={}){const n=r,{target:s,eventOptions:o,window:a,enabled:u,transform:h}=n,p=ft(n,dt);if(t.shared=G({target:s,eventOptions:o,window:a,enabled:u,transform:h},lt),e){const c=X.get(e);t[e]=G(d({shared:t.shared},p),c)}else for(const c in p){const w=X.get(c);if(w)t[c]=G(d({shared:t.shared},p[c]),w);else if(process.env.NODE_ENV==="development"&&!["drag","pinch","scroll","wheel","move","hover"].includes(c)){if(c==="domTarget")throw Error("[@use-gesture]: `domTarget` option has been renamed to `target`.");console.warn(`[@use-gesture]: Unknown config key \`${c}\` was used. Please read the documentation for further information.`)}}return t}class ve{constructor(e,t){_(this,"_listeners",new Set),this._ctrl=e,this._gestureKey=t}add(e,t,n,s,o){const a=this._listeners,u=Le(t,n),h=this._gestureKey?this._ctrl.config[this._gestureKey].eventOptions:{},p=d(d({},h),o);e.addEventListener(u,s,p);const c=()=>{e.removeEventListener(u,s,p),a.delete(c)};return a.add(c),c}clean(){this._listeners.forEach(e=>e()),this._listeners.clear()}}class pt{constructor(){_(this,"_timeouts",new Map)}add(e,t,n=140,...s){this.remove(e),this._timeouts.set(e,window.setTimeout(t,n,...s))}remove(e){const t=this._timeouts.get(e);t&&window.clearTimeout(t)}clean(){this._timeouts.forEach(e=>void window.clearTimeout(e)),this._timeouts.clear()}}class mt{constructor(e){_(this,"gestures",new Set),_(this,"_targetEventStore",new ve(this)),_(this,"gestureEventStores",{}),_(this,"gestureTimeoutStores",{}),_(this,"handlers",{}),_(this,"config",{}),_(this,"pointerIds",new Set),_(this,"touchIds",new Set),_(this,"state",{shared:{shiftKey:!1,metaKey:!1,ctrlKey:!1,altKey:!1}}),gt(this,e)}setEventIds(e){if(B(e))return this.touchIds=new Set(Ue(e)),this.touchIds;if("pointerId"in e)return e.type==="pointerup"||e.type==="pointercancel"?this.pointerIds.delete(e.pointerId):e.type==="pointerdown"&&this.pointerIds.add(e.pointerId),this.pointerIds}applyHandlers(e,t){this.handlers=e,this.nativeHandlers=t}applyConfig(e,t){this.config=ht(e,t,this.config)}clean(){this._targetEventStore.clean();for(const e of this.gestures)this.gestureEventStores[e].clean(),this.gestureTimeoutStores[e].clean()}effect(){return this.config.shared.target&&this.bind(),()=>this._targetEventStore.clean()}bind(...e){const t=this.config.shared,n={};let s;if(!(t.target&&(s=t.target(),!s))){if(t.enabled){for(const a of this.gestures){const u=this.config[a],h=ye(n,u.eventOptions,!!s);if(u.enabled){const p=ge.get(a);new p(this,e,a).bind(h)}}const o=ye(n,t.eventOptions,!!s);for(const a in this.nativeHandlers)o(a,"",u=>this.nativeHandlers[a](d(d({},this.state.shared),{},{event:u,args:e})),void 0,!0)}for(const o in n)n[o]=ze(...n[o]);if(!s)return n;for(const o in n){const{device:a,capture:u,passive:h}=Ve(o);this._targetEventStore.add(s,a,"",n[o],{capture:u,passive:h})}}}}function N(r,e){r.gestures.add(e),r.gestureEventStores[e]=new ve(r,e),r.gestureTimeoutStores[e]=new pt}function gt(r,e){e.drag&&N(r,"drag"),e.wheel&&N(r,"wheel"),e.scroll&&N(r,"scroll"),e.move&&N(r,"move"),e.pinch&&N(r,"pinch"),e.hover&&N(r,"hover")}const ye=(r,e,t)=>(n,s,o,a={},u=!1)=>{var h,p;const c=(h=a.capture)!==null&&h!==void 0?h:e.capture,w=(p=a.passive)!==null&&p!==void 0?p:e.passive;let y=u?n:Ne(n,s,c);t&&w&&(y+="Passive"),r[y]=r[y]||[],r[y].push(o)};function vt(r,e={},t,n){const s=m.useMemo(()=>new mt(r),[]);if(s.applyHandlers(r,n),s.applyConfig(e,t),m.useEffect(s.effect.bind(s)),m.useEffect(()=>s.clean.bind(s),[]),e.target===void 0)return s.bind.bind(s)}function yt(r,e){return at(ct),vt({drag:r},e||{},"drag")}const q="RSC::Event";function bt(){const r=m.useRef(null);function e(n){m.useEffect(()=>{r.current||(r.current=document.createElement("div"));function s(o){n(o.detail)}if(r.current)return r.current.addEventListener(q,s,!1),()=>{var o;(o=r.current)==null||o.removeEventListener(q,s,!1)}},[n])}function t(n){if(r.current){const s=new CustomEvent(q,{detail:n});r.current.dispatchEvent(s)}}return{useListenToCustomEvent:e,emitEvent:t}}function _t({init:r=!0,items:e,withLoop:t=!1,id:n,gutter:s=[{breakpoint:0,gutter:0,startEndGutter:0}],itemsPerSlide:o=[{breakpoint:0,itemsPerSlide:1}],carouselAxis:a="x",startingPosition:u="start",enableGestures:h=!0,slideWhenDragThresholdIsReached:p=!0,onInit:c,initialActiveItem:w=0}){const[y,M]=m.useState(!1),C=m.useRef(r),T=m.useRef(null),A=m.useRef(null),V=m.useRef(0),k=m.useRef(0),P=m.useRef(!t),$=m.useRef(!1),U=m.useRef(0),l=m.useRef(0),[K,J]=ke.useSpring(()=>({value:0,onChange({value:i}){T.current.style.setProperty(`--${n}-offset-position`,`${i.value}px`)}}),[a]),wt=t?[...e.map(i=>({...i,id:`prev-repeated-item-${i.id}`,isClonedItem:!0})),...e,...e.map(i=>({...i,id:`next-repeated-item-${i.id}`,isClonedItem:!0}))]:e,{useListenToCustomEvent:be,emitEvent:Y}=bt();function _e(){const{totalGutterCssVar:i}=Ee();return i}function we(){if(T.current){const f=window.getComputedStyle(T.current).getPropertyValue(`--${n}-items-per-slide`).trim();return Number(f)||1}return 1}function Q(i){C.current&&($.current||L({type:"next",toIndex:i,actionType:"click"}))}function Z(i){C.current&&(P.current||L({type:"prev",toIndex:i,actionType:"click"}))}function L({type:i,shouldAnimate:f=!0,toIndex:b,actionType:g}){var Se,xe;const E=!f;P.current=!1,$.current=!1;let S=K.value.get(),x=0;if(i==="next"&&(l.current+=1),i==="prev"&&(l.current===0?l.current=e.length-1:l.current-=1),b!==void 0&&(l.current=b),i==="next"){const F=ee(t?k.current*(e.length*2):0);x=-(l.current*k.current),t&&l.current===e.length&&(l.current=0,S=S+k.current*e.length,x=0),!t&&Math.abs(x)>=F&&($.current=!0,x=-F)}i==="prev"&&(x=-(l.current*k.current),l.current===e.length-1&&(S=S-e.length*k.current),!t&&x>=0&&(P.current=!0,x=0)),V.current=x,g==="resize"?(x=-(l.current*k.current),Y({eventName:"onResize",sliceActionType:g,slideDirection:i,currentItem:{index:l.current,id:((Se=e.at(l.current))==null?void 0:Se.id)??"",startReached:P.current,endReached:$.current}})):Y({eventName:"onSlideStartChange",sliceActionType:g,slideDirection:i,nextItem:{index:l.current,id:((xe=e.at(l.current))==null?void 0:xe.id)??"",startReached:P.current,endReached:$.current}}),J.start({immediate:E,from:{value:S},to:{value:x},onRest({finished:F}){var Ie;F&&Y({eventName:"onSlideChangeComplete",sliceActionType:g,slideDirection:i,currentItem:{index:l.current,id:((Ie=e.at(l.current))==null?void 0:Ie.id)??"",startReached:P.current,endReached:$.current}})}})}function Et(){const i=A.current.children[0];let f=0;return f=i.getBoundingClientRect()[a==="x"?"width":"height"]+_e(),f}function ee(i){const f=A.current;return f[a==="x"?"scrollWidth":"scrollHeight"]-f.getBoundingClientRect()[a==="x"?"width":"height"]-i}function Ee(){let i=0,f=0;if(T.current){const b=window.getComputedStyle(T.current),g=b.getPropertyValue(`--${n}-start-end-gutter`).trim();g.includes("px")&&(i=Number(g.replace("px","")));const E=b.getPropertyValue(`--${n}-gutter`).trim();E.includes("px")&&(f=Number(E.replace("px","")))}return{totalStartEndGutterCssVar:i,totalGutterCssVar:f}}m.useEffect(()=>{function i(g){const E=we();switch(g){case"start":return 0;case"middle-start":return Math.floor((E-1)*.25);case"center":return Math.floor((E-1)*.5);case"middle-end":return Math.floor((E-1)*.75);case"end":return E-1;default:return 0}}function f(g){if(k.current=Et(),U.current=k.current/4,T.current){const{totalStartEndGutterCssVar:E}=Ee();let S=0;t&&(S=k.current*e.length),S-=k.current*i(u),S-=E/2,T.current.style.setProperty(`--${n}-offset-modifier`,`${-S}px`),M(!0),g&&g()}}function b(){f(),L({type:"resize",toIndex:l.current,shouldAnimate:!1,actionType:"resize"})}if(r)return C.current=!0,f(c),window.addEventListener("resize",b),()=>{window.removeEventListener("resize",b)}},[r,t,n,a,s,u]),m.useEffect(()=>{r&&w!==l.current&&L({type:"next",toIndex:w,actionType:"resize",shouldAnimate:!1})},[r,w]);const Te=h,Tt=yt(i=>{if(!C.current)return;const f=i.dragging,b=i.offset[a==="x"?0:1],g=i.movement[a==="x"?0:1],E=g>U.current,S=g<-U.current,x=i.velocity;f&&(Y({...i,eventName:"onDrag",slideActionType:"drag"}),J.start({value:b,immediate:!0,config:{velocity:x}}),p&&(E||S)&&i.cancel()),i.last&&(E?(L({actionType:"drag",type:"prev"}),i.cancel()):S?(L({actionType:"drag",type:"next"}),i.cancel()):(J.start({value:V.current,config:{velocity:x}}),i.cancel()))},{enabled:Te,axis:a,rubberband:!t,...t?{}:{bounds:()=>({right:0,left:-ee(0),top:-ee(0),bottom:0})},from:()=>[K.value.get(),K.value.get()]});function St(i){var f,b;return typeof i=="number"?l.current===i:((f=e.find(g=>g.id===i))==null?void 0:f.id)===((b=e[l.current])==null?void 0:b.id)}return{carouselFragment:O.jsxs("div",{ref:T,className:"ReactSpringCarouselContainer","data-part":"Container","data-part-internal":`${n}-Container`,...Tt(),children:[O.jsx("style",{dangerouslySetInnerHTML:{__html:`
1
+ (function(A,L){typeof exports=="object"&&typeof module<"u"?L(exports,require("react/jsx-runtime"),require("@react-spring/web"),require("react")):typeof define=="function"&&define.amd?define(["exports","react/jsx-runtime","@react-spring/web","react"],L):(A=typeof globalThis<"u"?globalThis:A||self,L(A["react-spring-carousel"]={},A["react/jsx-runtime"],A["@react-spring/web"],A.React))})(this,function(A,L,re,m){"use strict";function Ce(t,e,r){return Math.max(e,Math.min(t,r))}const b={toVector(t,e){return t===void 0&&(t=e),Array.isArray(t)?t:[t,t]},add(t,e){return[t[0]+e[0],t[1]+e[1]]},sub(t,e){return[t[0]-e[0],t[1]-e[1]]},addTo(t,e){t[0]+=e[0],t[1]+=e[1]},subTo(t,e){t[0]-=e[0],t[1]-=e[1]}};function ne(t,e,r){return e===0||Math.abs(e)===1/0?Math.pow(t,r*5):t*e*r/(e+r*t)}function se(t,e,r,n=.15){return n===0?Ce(t,e,r):t<e?-ne(e-t,r-e,n)+e:t>r?+ne(t-r,r-e,n)+r:t}function De(t,[e,r],[n,s]){const[[o,a],[c,l]]=t;return[se(e,o,a,n),se(r,c,l,s)]}function Pe(t,e){if(typeof t!="object"||t===null)return t;var r=t[Symbol.toPrimitive];if(r!==void 0){var n=r.call(t,e);if(typeof n!="object")return n;throw new TypeError("@@toPrimitive must return a primitive value.")}return(e==="string"?String:Number)(t)}function $e(t){var e=Pe(t,"string");return typeof e=="symbol"?e:String(e)}function S(t,e,r){return e=$e(e),e in t?Object.defineProperty(t,e,{value:r,enumerable:!0,configurable:!0,writable:!0}):t[e]=r,t}function ie(t,e){var r=Object.keys(t);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(t);e&&(n=n.filter(function(s){return Object.getOwnPropertyDescriptor(t,s).enumerable})),r.push.apply(r,n)}return r}function p(t){for(var e=1;e<arguments.length;e++){var r=arguments[e]!=null?arguments[e]:{};e%2?ie(Object(r),!0).forEach(function(n){S(t,n,r[n])}):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(r)):ie(Object(r)).forEach(function(n){Object.defineProperty(t,n,Object.getOwnPropertyDescriptor(r,n))})}return t}const oe={pointer:{start:"down",change:"move",end:"up"},mouse:{start:"down",change:"move",end:"up"},touch:{start:"start",change:"move",end:"end"},gesture:{start:"start",change:"change",end:"end"}};function ae(t){return t?t[0].toUpperCase()+t.slice(1):""}const Oe=["enter","leave"];function Ae(t=!1,e){return t&&!Oe.includes(e)}function Ne(t,e="",r=!1){const n=oe[t],s=n&&n[e]||e;return"on"+ae(t)+ae(s)+(Ae(r,s)?"Capture":"")}const Le=["gotpointercapture","lostpointercapture"];function Me(t){let e=t.substring(2).toLowerCase();const r=!!~e.indexOf("passive");r&&(e=e.replace("passive",""));const n=Le.includes(e)?"capturecapture":"capture",s=!!~e.indexOf(n);return s&&(e=e.replace("capture","")),{device:e,capture:s,passive:r}}function Ve(t,e=""){const r=oe[t],n=r&&r[e]||e;return t+n}function K(t){return"touches"in t}function ce(t){return K(t)?"touch":"pointerType"in t?t.pointerType:"mouse"}function je(t){return Array.from(t.touches).filter(e=>{var r,n;return e.target===t.currentTarget||((r=t.currentTarget)===null||r===void 0||(n=r.contains)===null||n===void 0?void 0:n.call(r,e.target))})}function Re(t){return t.type==="touchend"||t.type==="touchcancel"?t.changedTouches:t.targetTouches}function ue(t){return K(t)?Re(t)[0]:t}function Be(t){return je(t).map(e=>e.identifier)}function F(t){const e=ue(t);return K(t)?e.identifier:e.pointerId}function le(t){const e=ue(t);return[e.clientX,e.clientY]}function Ue(t){const e={};if("buttons"in t&&(e.buttons=t.buttons),"shiftKey"in t){const{shiftKey:r,altKey:n,metaKey:s,ctrlKey:o}=t;Object.assign(e,{shiftKey:r,altKey:n,metaKey:s,ctrlKey:o})}return e}function G(t,...e){return typeof t=="function"?t(...e):t}function Ke(){}function Ge(...t){return t.length===0?Ke:t.length===1?t[0]:function(){let e;for(const r of t)e=r.apply(this,arguments)||e;return e}}function fe(t,e){return Object.assign({},e,t||{})}const ze=32;class We{constructor(e,r,n){this.ctrl=e,this.args=r,this.key=n,this.state||(this.state={},this.computeValues([0,0]),this.computeInitial(),this.init&&this.init(),this.reset())}get state(){return this.ctrl.state[this.key]}set state(e){this.ctrl.state[this.key]=e}get shared(){return this.ctrl.state.shared}get eventStore(){return this.ctrl.gestureEventStores[this.key]}get timeoutStore(){return this.ctrl.gestureTimeoutStores[this.key]}get config(){return this.ctrl.config[this.key]}get sharedConfig(){return this.ctrl.config.shared}get handler(){return this.ctrl.handlers[this.key]}reset(){const{state:e,shared:r,ingKey:n,args:s}=this;r[n]=e._active=e.active=e._blocked=e._force=!1,e._step=[!1,!1],e.intentional=!1,e._movement=[0,0],e._distance=[0,0],e._direction=[0,0],e._delta=[0,0],e._bounds=[[-1/0,1/0],[-1/0,1/0]],e.args=s,e.axis=void 0,e.memo=void 0,e.elapsedTime=e.timeDelta=0,e.direction=[0,0],e.distance=[0,0],e.overflow=[0,0],e._movementBound=[!1,!1],e.velocity=[0,0],e.movement=[0,0],e.delta=[0,0],e.timeStamp=0}start(e){const r=this.state,n=this.config;r._active||(this.reset(),this.computeInitial(),r._active=!0,r.target=e.target,r.currentTarget=e.currentTarget,r.lastOffset=n.from?G(n.from,r):r.offset,r.offset=r.lastOffset,r.startTime=r.timeStamp=e.timeStamp)}computeValues(e){const r=this.state;r._values=e,r.values=this.config.transform(e)}computeInitial(){const e=this.state;e._initial=e._values,e.initial=e.values}compute(e){const{state:r,config:n,shared:s}=this;r.args=this.args;let o=0;if(e&&(r.event=e,n.preventDefault&&e.cancelable&&r.event.preventDefault(),r.type=e.type,s.touches=this.ctrl.pointerIds.size||this.ctrl.touchIds.size,s.locked=!!document.pointerLockElement,Object.assign(s,Ue(e)),s.down=s.pressed=s.buttons%2===1||s.touches>0,o=e.timeStamp-r.timeStamp,r.timeStamp=e.timeStamp,r.elapsedTime=r.timeStamp-r.startTime),r._active){const d=r._delta.map(Math.abs);b.addTo(r._distance,d)}this.axisIntent&&this.axisIntent(e);const[a,c]=r._movement,[l,h]=n.threshold,{_step:u,values:v}=r;if(n.hasCustomTransform?(u[0]===!1&&(u[0]=Math.abs(a)>=l&&v[0]),u[1]===!1&&(u[1]=Math.abs(c)>=h&&v[1])):(u[0]===!1&&(u[0]=Math.abs(a)>=l&&Math.sign(a)*l),u[1]===!1&&(u[1]=Math.abs(c)>=h&&Math.sign(c)*h)),r.intentional=u[0]!==!1||u[1]!==!1,!r.intentional)return;const g=[0,0];if(n.hasCustomTransform){const[d,U]=v;g[0]=u[0]!==!1?d-u[0]:0,g[1]=u[1]!==!1?U-u[1]:0}else g[0]=u[0]!==!1?a-u[0]:0,g[1]=u[1]!==!1?c-u[1]:0;this.restrictToAxis&&!r._blocked&&this.restrictToAxis(g);const $=r.offset,w=r._active&&!r._blocked||r.active;w&&(r.first=r._active&&!r.active,r.last=!r._active&&r.active,r.active=s[this.ingKey]=r._active,e&&(r.first&&("bounds"in n&&(r._bounds=G(n.bounds,r)),this.setup&&this.setup()),r.movement=g,this.computeOffset()));const[E,O]=r.offset,[[N,T],[I,k]]=r._bounds;r.overflow=[E<N?-1:E>T?1:0,O<I?-1:O>k?1:0],r._movementBound[0]=r.overflow[0]?r._movementBound[0]===!1?r._movement[0]:r._movementBound[0]:!1,r._movementBound[1]=r.overflow[1]?r._movementBound[1]===!1?r._movement[1]:r._movementBound[1]:!1;const B=r._active?n.rubberband||[0,0]:[0,0];if(r.offset=De(r._bounds,r.offset,B),r.delta=b.sub(r.offset,$),this.computeMovement(),w&&(!r.last||o>ze)){r.delta=b.sub(r.offset,$);const d=r.delta.map(Math.abs);b.addTo(r.distance,d),r.direction=r.delta.map(Math.sign),r._direction=r._delta.map(Math.sign),!r.first&&o>0&&(r.velocity=[d[0]/o,d[1]/o],r.timeDelta=o)}}emit(){const e=this.state,r=this.shared,n=this.config;if(e._active||this.clean(),(e._blocked||!e.intentional)&&!e._force&&!n.triggerAllEvents)return;const s=this.handler(p(p(p({},r),e),{},{[this.aliasKey]:e.values}));s!==void 0&&(e.memo=s)}clean(){this.eventStore.clean(),this.timeoutStore.clean()}}function Ye([t,e],r){const n=Math.abs(t),s=Math.abs(e);if(n>s&&n>r)return"x";if(s>n&&s>r)return"y"}class Fe extends We{constructor(...e){super(...e),S(this,"aliasKey","xy")}reset(){super.reset(),this.state.axis=void 0}init(){this.state.offset=[0,0],this.state.lastOffset=[0,0]}computeOffset(){this.state.offset=b.add(this.state.lastOffset,this.state.movement)}computeMovement(){this.state.movement=b.sub(this.state.offset,this.state.lastOffset)}axisIntent(e){const r=this.state,n=this.config;if(!r.axis&&e){const s=typeof n.axisThreshold=="object"?n.axisThreshold[ce(e)]:n.axisThreshold;r.axis=Ye(r._movement,s)}r._blocked=(n.lockDirection||!!n.axis)&&!r.axis||!!n.axis&&n.axis!==r.axis}restrictToAxis(e){if(this.config.axis||this.config.lockDirection)switch(this.state.axis){case"x":e[1]=0;break;case"y":e[0]=0;break}}}const de=t=>t,he=.15,H={enabled(t=!0){return t},eventOptions(t,e,r){return p(p({},r.shared.eventOptions),t)},preventDefault(t=!1){return t},triggerAllEvents(t=!1){return t},rubberband(t=0){switch(t){case!0:return[he,he];case!1:return[0,0];default:return b.toVector(t)}},from(t){if(typeof t=="function")return t;if(t!=null)return b.toVector(t)},transform(t,e,r){const n=t||r.shared.transform;if(this.hasCustomTransform=!!n,process.env.NODE_ENV==="development"){const s=n||de;return o=>{const a=s(o);return(!isFinite(a[0])||!isFinite(a[1]))&&console.warn(`[@use-gesture]: config.transform() must produce a valid result, but it was: [${a[0]},${[1]}]`),a}}return n||de},threshold(t){return b.toVector(t,0)}};process.env.NODE_ENV==="development"&&Object.assign(H,{domTarget(t){if(t!==void 0)throw Error("[@use-gesture]: `domTarget` option has been renamed to `target`.");return NaN},lockDirection(t){if(t!==void 0)throw Error("[@use-gesture]: `lockDirection` option has been merged with `axis`. Use it as in `{ axis: 'lock' }`");return NaN},initial(t){if(t!==void 0)throw Error("[@use-gesture]: `initial` option has been renamed to `from`.");return NaN}});const He=0,j=p(p({},H),{},{axis(t,e,{axis:r}){if(this.lockDirection=r==="lock",!this.lockDirection)return r},axisThreshold(t=He){return t},bounds(t={}){if(typeof t=="function")return o=>j.bounds(t(o));if("current"in t)return()=>t.current;if(typeof HTMLElement=="function"&&t instanceof HTMLElement)return t;const{left:e=-1/0,right:r=1/0,top:n=-1/0,bottom:s=1/0}=t;return[[e,r],[n,s]]}}),pe={ArrowRight:(t,e=1)=>[t*e,0],ArrowLeft:(t,e=1)=>[-1*t*e,0],ArrowUp:(t,e=1)=>[0,-1*t*e],ArrowDown:(t,e=1)=>[0,t*e]};class Xe extends Fe{constructor(...e){super(...e),S(this,"ingKey","dragging")}reset(){super.reset();const e=this.state;e._pointerId=void 0,e._pointerActive=!1,e._keyboardActive=!1,e._preventScroll=!1,e._delayed=!1,e.swipe=[0,0],e.tap=!1,e.canceled=!1,e.cancel=this.cancel.bind(this)}setup(){const e=this.state;if(e._bounds instanceof HTMLElement){const r=e._bounds.getBoundingClientRect(),n=e.currentTarget.getBoundingClientRect(),s={left:r.left-n.left+e.offset[0],right:r.right-n.right+e.offset[0],top:r.top-n.top+e.offset[1],bottom:r.bottom-n.bottom+e.offset[1]};e._bounds=j.bounds(s)}}cancel(){const e=this.state;e.canceled||(e.canceled=!0,e._active=!1,setTimeout(()=>{this.compute(),this.emit()},0))}setActive(){this.state._active=this.state._pointerActive||this.state._keyboardActive}clean(){this.pointerClean(),this.state._pointerActive=!1,this.state._keyboardActive=!1,super.clean()}pointerDown(e){const r=this.config,n=this.state;if(e.buttons!=null&&(Array.isArray(r.pointerButtons)?!r.pointerButtons.includes(e.buttons):r.pointerButtons!==-1&&r.pointerButtons!==e.buttons))return;const s=this.ctrl.setEventIds(e);r.pointerCapture&&e.target.setPointerCapture(e.pointerId),!(s&&s.size>1&&n._pointerActive)&&(this.start(e),this.setupPointer(e),n._pointerId=F(e),n._pointerActive=!0,this.computeValues(le(e)),this.computeInitial(),r.preventScrollAxis&&ce(e)!=="mouse"?(n._active=!1,this.setupScrollPrevention(e)):r.delay>0?(this.setupDelayTrigger(e),r.triggerAllEvents&&(this.compute(e),this.emit())):this.startPointerDrag(e))}startPointerDrag(e){const r=this.state;r._active=!0,r._preventScroll=!0,r._delayed=!1,this.compute(e),this.emit()}pointerMove(e){const r=this.state,n=this.config;if(!r._pointerActive)return;const s=F(e);if(r._pointerId!==void 0&&s!==r._pointerId)return;const o=le(e);if(document.pointerLockElement===e.target?r._delta=[e.movementX,e.movementY]:(r._delta=b.sub(o,r._values),this.computeValues(o)),b.addTo(r._movement,r._delta),this.compute(e),r._delayed&&r.intentional){this.timeoutStore.remove("dragDelay"),r.active=!1,this.startPointerDrag(e);return}if(n.preventScrollAxis&&!r._preventScroll)if(r.axis)if(r.axis===n.preventScrollAxis||n.preventScrollAxis==="xy"){r._active=!1,this.clean();return}else{this.timeoutStore.remove("startPointerDrag"),this.startPointerDrag(e);return}else return;this.emit()}pointerUp(e){this.ctrl.setEventIds(e);try{this.config.pointerCapture&&e.target.hasPointerCapture(e.pointerId)&&e.target.releasePointerCapture(e.pointerId)}catch{process.env.NODE_ENV==="development"&&console.warn("[@use-gesture]: If you see this message, it's likely that you're using an outdated version of `@react-three/fiber`. \n\nPlease upgrade to the latest version.")}const r=this.state,n=this.config;if(!r._active||!r._pointerActive)return;const s=F(e);if(r._pointerId!==void 0&&s!==r._pointerId)return;this.state._pointerActive=!1,this.setActive(),this.compute(e);const[o,a]=r._distance;if(r.tap=o<=n.tapsThreshold&&a<=n.tapsThreshold,r.tap&&n.filterTaps)r._force=!0;else{const[c,l]=r._delta,[h,u]=r._movement,[v,g]=n.swipe.velocity,[$,w]=n.swipe.distance,E=n.swipe.duration;if(r.elapsedTime<E){const O=Math.abs(c/r.timeDelta),N=Math.abs(l/r.timeDelta);O>v&&Math.abs(h)>$&&(r.swipe[0]=Math.sign(c)),N>g&&Math.abs(u)>w&&(r.swipe[1]=Math.sign(l))}}this.emit()}pointerClick(e){!this.state.tap&&e.detail>0&&(e.preventDefault(),e.stopPropagation())}setupPointer(e){const r=this.config,n=r.device;if(process.env.NODE_ENV==="development")try{if(n==="pointer"&&r.preventScrollDelay===void 0){const s="uv"in e?e.sourceEvent.currentTarget:e.currentTarget;window.getComputedStyle(s).touchAction==="auto"&&console.warn("[@use-gesture]: The drag target has its `touch-action` style property set to `auto`. It is recommended to add `touch-action: 'none'` so that the drag gesture behaves correctly on touch-enabled devices. For more information read this: https://use-gesture.netlify.app/docs/extras/#touch-action.\n\nThis message will only show in development mode. It won't appear in production. If this is intended, you can ignore it.",s)}}catch{}r.pointerLock&&e.currentTarget.requestPointerLock(),r.pointerCapture||(this.eventStore.add(this.sharedConfig.window,n,"change",this.pointerMove.bind(this)),this.eventStore.add(this.sharedConfig.window,n,"end",this.pointerUp.bind(this)),this.eventStore.add(this.sharedConfig.window,n,"cancel",this.pointerUp.bind(this)))}pointerClean(){this.config.pointerLock&&document.pointerLockElement===this.state.currentTarget&&document.exitPointerLock()}preventScroll(e){this.state._preventScroll&&e.cancelable&&e.preventDefault()}setupScrollPrevention(e){this.state._preventScroll=!1,qe(e);const r=this.eventStore.add(this.sharedConfig.window,"touch","change",this.preventScroll.bind(this),{passive:!1});this.eventStore.add(this.sharedConfig.window,"touch","end",r),this.eventStore.add(this.sharedConfig.window,"touch","cancel",r),this.timeoutStore.add("startPointerDrag",this.startPointerDrag.bind(this),this.config.preventScrollDelay,e)}setupDelayTrigger(e){this.state._delayed=!0,this.timeoutStore.add("dragDelay",()=>{this.state._step=[0,0],this.startPointerDrag(e)},this.config.delay)}keyDown(e){const r=pe[e.key];if(r){const n=this.state,s=e.shiftKey?10:e.altKey?.1:1;this.start(e),n._delta=r(this.config.keyboardDisplacement,s),n._keyboardActive=!0,b.addTo(n._movement,n._delta),this.compute(e),this.emit()}}keyUp(e){e.key in pe&&(this.state._keyboardActive=!1,this.setActive(),this.compute(e),this.emit())}bind(e){const r=this.config.device;e(r,"start",this.pointerDown.bind(this)),this.config.pointerCapture&&(e(r,"change",this.pointerMove.bind(this)),e(r,"end",this.pointerUp.bind(this)),e(r,"cancel",this.pointerUp.bind(this)),e("lostPointerCapture","",this.pointerUp.bind(this))),this.config.keys&&(e("key","down",this.keyDown.bind(this)),e("key","up",this.keyUp.bind(this))),this.config.filterTaps&&e("click","",this.pointerClick.bind(this),{capture:!0,passive:!1})}}function qe(t){"persist"in t&&typeof t.persist=="function"&&t.persist()}const R=typeof window<"u"&&window.document&&window.document.createElement;function me(){return R&&"ontouchstart"in window}function Je(){return me()||R&&window.navigator.maxTouchPoints>1}function Qe(){return R&&"onpointerdown"in window}function Ze(){return R&&"exitPointerLock"in window.document}function et(){try{return"constructor"in GestureEvent}catch{return!1}}const P={isBrowser:R,gesture:et(),touch:me(),touchscreen:Je(),pointer:Qe(),pointerLock:Ze()},tt=250,rt=180,nt=.5,st=50,it=250,ot=10,ge={mouse:0,touch:0,pen:8},ve=p(p({},j),{},{device(t,e,{pointer:{touch:r=!1,lock:n=!1,mouse:s=!1}={}}){return this.pointerLock=n&&P.pointerLock,P.touch&&r?"touch":this.pointerLock?"mouse":P.pointer&&!s?"pointer":P.touch?"touch":"mouse"},preventScrollAxis(t,e,{preventScroll:r}){if(this.preventScrollDelay=typeof r=="number"?r:r||r===void 0&&t?tt:void 0,!(!P.touchscreen||r===!1))return t||(r!==void 0?"y":void 0)},pointerCapture(t,e,{pointer:{capture:r=!0,buttons:n=1,keys:s=!0}={}}){return this.pointerButtons=n,this.keys=s,!this.pointerLock&&this.device==="pointer"&&r},threshold(t,e,{filterTaps:r=!1,tapsThreshold:n=3,axis:s=void 0}){const o=b.toVector(t,r?n:s?1:0);return this.filterTaps=r,this.tapsThreshold=n,o},swipe({velocity:t=nt,distance:e=st,duration:r=it}={}){return{velocity:this.transform(b.toVector(t)),distance:this.transform(b.toVector(e)),duration:r}},delay(t=0){switch(t){case!0:return rt;case!1:return 0;default:return t}},axisThreshold(t){return t?p(p({},ge),t):ge},keyboardDisplacement(t=ot){return t}});process.env.NODE_ENV==="development"&&Object.assign(ve,{useTouch(t){if(t!==void 0)throw Error("[@use-gesture]: `useTouch` option has been renamed to `pointer.touch`. Use it as in `{ pointer: { touch: true } }`.");return NaN},experimental_preventWindowScrollY(t){if(t!==void 0)throw Error("[@use-gesture]: `experimental_preventWindowScrollY` option has been renamed to `preventScroll`.");return NaN},swipeVelocity(t){if(t!==void 0)throw Error("[@use-gesture]: `swipeVelocity` option has been renamed to `swipe.velocity`. Use it as in `{ swipe: { velocity: 0.5 } }`.");return NaN},swipeDistance(t){if(t!==void 0)throw Error("[@use-gesture]: `swipeDistance` option has been renamed to `swipe.distance`. Use it as in `{ swipe: { distance: 50 } }`.");return NaN},swipeDuration(t){if(t!==void 0)throw Error("[@use-gesture]: `swipeDuration` option has been renamed to `swipe.duration`. Use it as in `{ swipe: { duration: 250 } }`.");return NaN}}),p(p({},H),{},{device(t,e,{shared:r,pointer:{touch:n=!1}={}}){if(r.target&&!P.touch&&P.gesture)return"gesture";if(P.touch&&n)return"touch";if(P.touchscreen){if(P.pointer)return"pointer";if(P.touch)return"touch"}},bounds(t,e,{scaleBounds:r={},angleBounds:n={}}){const s=a=>{const c=fe(G(r,a),{min:-1/0,max:1/0});return[c.min,c.max]},o=a=>{const c=fe(G(n,a),{min:-1/0,max:1/0});return[c.min,c.max]};return typeof r!="function"&&typeof n!="function"?[s(),o()]:a=>[s(a),o(a)]},threshold(t,e,r){return this.lockDirection=r.axis==="lock",b.toVector(t,this.lockDirection?[.1,3]:0)},modifierKey(t){return t===void 0?"ctrlKey":t},pinchOnWheel(t=!0){return t}}),p(p({},j),{},{mouseOnly:(t=!0)=>t}),p(p({},j),{},{mouseOnly:(t=!0)=>t});const ye=new Map,X=new Map;function at(t){ye.set(t.key,t.engine),X.set(t.key,t.resolver)}const ct={key:"drag",engine:Xe,resolver:ve};function ut(t,e){if(t==null)return{};var r={},n=Object.keys(t),s,o;for(o=0;o<n.length;o++)s=n[o],!(e.indexOf(s)>=0)&&(r[s]=t[s]);return r}function lt(t,e){if(t==null)return{};var r=ut(t,e),n,s;if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(t);for(s=0;s<o.length;s++)n=o[s],!(e.indexOf(n)>=0)&&Object.prototype.propertyIsEnumerable.call(t,n)&&(r[n]=t[n])}return r}const ft={target(t){if(t)return()=>"current"in t?t.current:t},enabled(t=!0){return t},window(t=P.isBrowser?window:void 0){return t},eventOptions({passive:t=!0,capture:e=!1}={}){return{passive:t,capture:e}},transform(t){return t}},dt=["target","eventOptions","window","enabled","transform"];function z(t={},e){const r={};for(const[n,s]of Object.entries(e))switch(typeof s){case"function":if(process.env.NODE_ENV==="development"){const o=s.call(r,t[n],n,t);Number.isNaN(o)||(r[n]=o)}else r[n]=s.call(r,t[n],n,t);break;case"object":r[n]=z(t[n],s);break;case"boolean":s&&(r[n]=t[n]);break}return r}function ht(t,e,r={}){const n=t,{target:s,eventOptions:o,window:a,enabled:c,transform:l}=n,h=lt(n,dt);if(r.shared=z({target:s,eventOptions:o,window:a,enabled:c,transform:l},ft),e){const u=X.get(e);r[e]=z(p({shared:r.shared},h),u)}else for(const u in h){const v=X.get(u);if(v)r[u]=z(p({shared:r.shared},h[u]),v);else if(process.env.NODE_ENV==="development"&&!["drag","pinch","scroll","wheel","move","hover"].includes(u)){if(u==="domTarget")throw Error("[@use-gesture]: `domTarget` option has been renamed to `target`.");console.warn(`[@use-gesture]: Unknown config key \`${u}\` was used. Please read the documentation for further information.`)}}return r}class be{constructor(e,r){S(this,"_listeners",new Set),this._ctrl=e,this._gestureKey=r}add(e,r,n,s,o){const a=this._listeners,c=Ve(r,n),l=this._gestureKey?this._ctrl.config[this._gestureKey].eventOptions:{},h=p(p({},l),o);e.addEventListener(c,s,h);const u=()=>{e.removeEventListener(c,s,h),a.delete(u)};return a.add(u),u}clean(){this._listeners.forEach(e=>e()),this._listeners.clear()}}class pt{constructor(){S(this,"_timeouts",new Map)}add(e,r,n=140,...s){this.remove(e),this._timeouts.set(e,window.setTimeout(r,n,...s))}remove(e){const r=this._timeouts.get(e);r&&window.clearTimeout(r)}clean(){this._timeouts.forEach(e=>void window.clearTimeout(e)),this._timeouts.clear()}}class mt{constructor(e){S(this,"gestures",new Set),S(this,"_targetEventStore",new be(this)),S(this,"gestureEventStores",{}),S(this,"gestureTimeoutStores",{}),S(this,"handlers",{}),S(this,"config",{}),S(this,"pointerIds",new Set),S(this,"touchIds",new Set),S(this,"state",{shared:{shiftKey:!1,metaKey:!1,ctrlKey:!1,altKey:!1}}),gt(this,e)}setEventIds(e){if(K(e))return this.touchIds=new Set(Be(e)),this.touchIds;if("pointerId"in e)return e.type==="pointerup"||e.type==="pointercancel"?this.pointerIds.delete(e.pointerId):e.type==="pointerdown"&&this.pointerIds.add(e.pointerId),this.pointerIds}applyHandlers(e,r){this.handlers=e,this.nativeHandlers=r}applyConfig(e,r){this.config=ht(e,r,this.config)}clean(){this._targetEventStore.clean();for(const e of this.gestures)this.gestureEventStores[e].clean(),this.gestureTimeoutStores[e].clean()}effect(){return this.config.shared.target&&this.bind(),()=>this._targetEventStore.clean()}bind(...e){const r=this.config.shared,n={};let s;if(!(r.target&&(s=r.target(),!s))){if(r.enabled){for(const a of this.gestures){const c=this.config[a],l=_e(n,c.eventOptions,!!s);if(c.enabled){const h=ye.get(a);new h(this,e,a).bind(l)}}const o=_e(n,r.eventOptions,!!s);for(const a in this.nativeHandlers)o(a,"",c=>this.nativeHandlers[a](p(p({},this.state.shared),{},{event:c,args:e})),void 0,!0)}for(const o in n)n[o]=Ge(...n[o]);if(!s)return n;for(const o in n){const{device:a,capture:c,passive:l}=Me(o);this._targetEventStore.add(s,a,"",n[o],{capture:c,passive:l})}}}}function M(t,e){t.gestures.add(e),t.gestureEventStores[e]=new be(t,e),t.gestureTimeoutStores[e]=new pt}function gt(t,e){e.drag&&M(t,"drag"),e.wheel&&M(t,"wheel"),e.scroll&&M(t,"scroll"),e.move&&M(t,"move"),e.pinch&&M(t,"pinch"),e.hover&&M(t,"hover")}const _e=(t,e,r)=>(n,s,o,a={},c=!1)=>{var l,h;const u=(l=a.capture)!==null&&l!==void 0?l:e.capture,v=(h=a.passive)!==null&&h!==void 0?h:e.passive;let g=c?n:Ne(n,s,u);r&&v&&(g+="Passive"),t[g]=t[g]||[],t[g].push(o)};function vt(t,e={},r,n){const s=m.useMemo(()=>new mt(t),[]);if(s.applyHandlers(t,n),s.applyConfig(e,r),m.useEffect(s.effect.bind(s)),m.useEffect(()=>s.clean.bind(s),[]),e.target===void 0)return s.bind.bind(s)}function yt(t,e){return at(ct),vt({drag:t},e||{},"drag")}const q="RSC::Event";function bt(){const t=m.useRef(null);function e(n){m.useEffect(()=>{t.current||(t.current=document.createElement("div"));function s(o){n(o.detail)}if(t.current)return t.current.addEventListener(q,s,!1),()=>{var o;(o=t.current)==null||o.removeEventListener(q,s,!1)}},[n])}function r(n){if(t.current){const s=new CustomEvent(q,{detail:n});t.current.dispatchEvent(s)}}return{useListenToCustomEvent:e,emitEvent:r}}function _t(t){let e=t.replace(/\/\*[\s\S]*?\*\/|([^:]|^)\/\/.*$/gm,"");return e=e.replace(/[\n\t]+/g," "),e=e.replace(/\s*([{}:;,])\s*/g,"$1"),e=e.replace(/\s+}/g,"}"),e=e.replace(/{\s+/g,"{"),e=e.replace(/\s+/g," "),e.trim()}function wt({init:t=!0,items:e,withLoop:r=!1,id:n,gutter:s=[{breakpoint:0,gutter:0,startEndGutter:0}],itemsPerSlide:o=[{breakpoint:0,itemsPerSlide:1}],carouselAxis:a="x",startingPosition:c="start",enableGestures:l=!0,slideWhenDragThresholdIsReached:h=!0,onInit:u,initialActiveItem:v=0}){const[g,$]=m.useState(!1),w=m.useRef(t),E=m.useRef(null),O=m.useRef(null),N=m.useRef(0),T=m.useRef(0),I=m.useRef(!r),k=m.useRef(!1),B=m.useRef(0),d=m.useRef(0),[U,Q]=re.useSpring(()=>({value:0,onChange({value:i}){E.current.style.setProperty(`--${n}-offset-position`,`${i.value}px`)}}),[a]),St=r?[...e.map(i=>({...i,id:`prev-repeated-item-${i.id}`,isClonedItem:!0})),...e,...e.map(i=>({...i,id:`next-repeated-item-${i.id}`,isClonedItem:!0}))]:e,{useListenToCustomEvent:Ee,emitEvent:W}=bt();function xt(){const{totalGutterCssVar:i}=Te();return i}function It(){if(E.current){const f=window.getComputedStyle(E.current).getPropertyValue(`--${n}-items-per-slide`).trim();return Number(f)||1}return 1}function Z(i){w.current&&(k.current||V({type:"next",toIndex:i,actionType:"click"}))}function ee(i){w.current&&(I.current||V({type:"prev",toIndex:i,actionType:"click"}))}function V({type:i,shouldAnimate:f=!0,toIndex:_,actionType:y}){var xe,Ie;const x=!f;I.current=!1,k.current=!1;let C=U.value.get(),D=0;if(i==="next"&&(d.current+=1),i==="prev"&&(d.current===0?d.current=e.length-1:d.current-=1),_!==void 0&&(d.current=_),i==="next"){const Y=te(r?T.current*(e.length*2):0);D=-(d.current*T.current),r&&d.current===e.length&&(d.current=0,C=C+T.current*e.length,D=0),!r&&Math.abs(D)>=Y&&(k.current=!0,D=-Y)}i==="prev"&&(D=-(d.current*T.current),d.current===e.length-1&&(C=C-e.length*T.current),!r&&D>=0&&(I.current=!0,D=0)),N.current=D,y==="resize"?(D=-(d.current*T.current),W({eventName:"onResize",sliceActionType:y,slideDirection:i,currentItem:{index:d.current,id:((xe=e.at(d.current))==null?void 0:xe.id)??"",startReached:I.current,endReached:k.current}})):W({eventName:"onSlideStartChange",sliceActionType:y,slideDirection:i,nextItem:{index:d.current,id:((Ie=e.at(d.current))==null?void 0:Ie.id)??"",startReached:I.current,endReached:k.current}}),Q.start({immediate:x,from:{value:C},to:{value:D},onRest({finished:Y}){var ke;Y&&W({eventName:"onSlideChangeComplete",sliceActionType:y,slideDirection:i,currentItem:{index:d.current,id:((ke=e.at(d.current))==null?void 0:ke.id)??"",startReached:I.current,endReached:k.current}})}})}function kt(){const i=O.current.children[0];let f=0;return f=i.getBoundingClientRect()[a==="x"?"width":"height"]+xt(),f}function te(i){const f=O.current;return f[a==="x"?"scrollWidth":"scrollHeight"]-f.getBoundingClientRect()[a==="x"?"width":"height"]-i}function Te(){let i=0,f=0;if(E.current){const _=window.getComputedStyle(E.current),y=_.getPropertyValue(`--${n}-start-end-gutter`).trim();y.includes("px")&&(i=Number(y.replace("px","")));const x=_.getPropertyValue(`--${n}-gutter`).trim();x.includes("px")&&(f=Number(x.replace("px","")))}return{totalStartEndGutterCssVar:i,totalGutterCssVar:f}}m.useEffect(()=>{function i(y){const x=It();switch(y){case"start":return 0;case"middle-start":return Math.floor((x-1)*.25);case"center":return Math.floor((x-1)*.5);case"middle-end":return Math.floor((x-1)*.75);case"end":return x-1;default:return 0}}function f(y){if(T.current=kt(),B.current=T.current/4,E.current){const{totalStartEndGutterCssVar:x}=Te();let C=0;r&&(C=T.current*e.length),C-=T.current*i(c),C-=x/2,E.current.style.setProperty(`--${n}-offset-modifier`,`${-C}px`),$(!0),y&&y()}}function _(){f(),V({type:"resize",toIndex:d.current,shouldAnimate:!1,actionType:"resize"})}if(t)return w.current=!0,f(u),window.addEventListener("resize",_),()=>{window.removeEventListener("resize",_)}},[t,r,n,a,s,c]),m.useEffect(()=>{t&&v!==d.current&&V({type:"next",toIndex:v,actionType:"resize",shouldAnimate:!1})},[t,v]);const Se=l,Ct=yt(i=>{if(!w.current)return;const f=i.dragging,_=i.offset[a==="x"?0:1],y=i.movement[a==="x"?0:1],x=y>B.current,C=y<-B.current,D=i.velocity;f&&(W({...i,eventName:"onDrag",slideActionType:"drag"}),Q.start({value:_,immediate:!0,config:{velocity:D}}),h&&(x||C)&&i.cancel()),i.last&&(x?(V({actionType:"drag",type:"prev"}),i.cancel()):C?(V({actionType:"drag",type:"next"}),i.cancel()):(Q.start({value:N.current,config:{velocity:D}}),i.cancel()))},{enabled:Se,axis:a,rubberband:!r,...r?{}:{bounds:()=>({right:0,left:-te(0),top:-te(0),bottom:0})},from:()=>[U.value.get(),U.value.get()]});function Dt(i){var f,_;return typeof i=="number"?d.current===i:((f=e.find(y=>y.id===i))==null?void 0:f.id)===((_=e[d.current])==null?void 0:_.id)}return{carouselFragment:L.jsxs("div",{ref:E,className:"ReactSpringCarouselContainer","data-part":"Container","data-part-internal":`${n}-Container`,...Ct(),children:[L.jsx("style",{dangerouslySetInnerHTML:{__html:_t(`
2
2
  [data-part-internal="${n}-Container"] {
3
3
  display: flex;
4
4
  width: 100%;
@@ -11,14 +11,14 @@
11
11
  --${n}-scroll-y-value: ${a==="y"?`calc(var(--${n}-offset-position) + var(--${n}-offset-modifier))`:"0px"};
12
12
  --${n}-gutter: 0px;
13
13
  --${n}-start-end-gutter: 0px;
14
- touch-action: ${Te?a==="x"?"pan-y":"pan-x":"auto"};
14
+ touch-action: ${Se?a==="x"?"pan-y":"pan-x":"auto"};
15
15
  }
16
16
  [data-part-internal="${n}-Track"] {
17
17
  display: flex;
18
18
  position: relative;
19
19
  --initial-offset-modifier: calc(calc(-100% - var(--${n}-gutter) + calc(var(--${n}-start-end-gutter) / 2 / ${e.length} * var(--${n}-items-per-slide)) + var(--${n}-start-end-gutter)) * ${e.length} / var(--${n}-items-per-slide));
20
- left: ${t&&a==="x"&&!y?"var(--initial-offset-modifier)":"0px"};
21
- top: ${t&&a==="y"&&!y?"var(--initial-offset-modifier)":"0px"};
20
+ left: ${r&&a==="x"&&!g?"var(--initial-offset-modifier)":"0px"};
21
+ top: ${r&&a==="y"&&!g?"var(--initial-offset-modifier)":"0px"};
22
22
  flex-direction: ${a==="x"?"row":"column"};
23
23
  width: 100%;
24
24
  height: 100%;
@@ -27,21 +27,21 @@
27
27
  }
28
28
  [data-part-internal="${n}-Item"] {
29
29
  display: flex;
30
- flex: 1 0 calc(100% / var(--${n}-items-per-slide) - calc(var(--${n}-gutter) * (var(--${n}-items-per-slide) - 1)) / var(--${n}-items-per-slide) - calc(var(--${n}-start-end-gutter) / var(--${n}-items-per-slide)))
30
+ flex: 1 0 calc(100% / var(--${n}-items-per-slide) - calc(var(--${n}-gutter) * (var(--${n}-items-per-slide) - 1)) / var(--${n}-items-per-slide) - calc(var(--${n}-start-end-gutter) / var(--${n}-items-per-slide)));
31
31
  }
32
32
  ${s&&s.length>0?s.sort((i,f)=>i.breakpoint-f.breakpoint).map(i=>`
33
- @media (min-width: ${i.breakpoint}px) {
34
- [data-part-internal="${n}-Container"] {
35
- --${n}-gutter: ${i.gutter||0}px;
36
- --${n}-start-end-gutter: ${(i.startEndGutter||0)*2}px;
37
- }
33
+ @media ${i.media||`(min-width: ${i.breakpoint}px)`} {
34
+ [data-part-internal="${n}-Container"] {
35
+ --${n}-gutter: ${i.gutter||0}px;
36
+ --${n}-start-end-gutter: ${(i.startEndGutter||0)*2}px;
38
37
  }
39
- `).join(""):""}
38
+ }
39
+ `).join(""):""}
40
40
  ${o&&o.length>0?o.sort((i,f)=>i.breakpoint-f.breakpoint).map(i=>`
41
- @media (min-width: ${i.breakpoint}px) {
42
- [data-part-internal="${n}-Container"] {
43
- --${n}-items-per-slide: ${i.itemsPerSlide||1};
44
- }
41
+ @media ${i.media||`(min-width: ${i.breakpoint}px)`} {
42
+ [data-part-internal="${n}-Container"] {
43
+ --${n}-items-per-slide: ${i.itemsPerSlide||1};
45
44
  }
46
- `).join(""):""}
47
- `}}),O.jsx("div",{ref:A,className:"ReactSpringCarouselTrack","data-part":"Track","data-part-internal":`${n}-Track`,onScroll:()=>{P.current=!1,$.current=!1},children:wt.map((i,f)=>O.jsx("div",{className:"ReactSpringCarouselItem","data-part":"Item","data-part-internal":`${n}-Item`,"data-id":i.id,children:typeof i.renderItem=="function"?i.renderItem({useListenToCustomEvent:be,index:f,isClonedItem:!!i.isClonedItem,isActiveItem:St}):i.renderItem},`${i.id}-${f}`))})]}),useListenToCustomEvent:be,slideToNextItem:()=>Q(),slideToPrevItem:()=>Z(),getGutter:_e,getItemsPerSlide:we,slideToItem:i=>{if(typeof i=="number"){if(!e[i]){console.warn(`The item you're trying to slide doesn't exist. index: ${i}`);return}i>l.current?Q(i):Z(i)}if(typeof i=="string"){const f=e.findIndex(b=>b.id===i);if(f<0){console.warn(`The item you're trying to slide doesn't exist. id: ${i}`);return}f>l.current?Q(f):Z(f)}}}}D.useSpringCarousel=_t,Object.defineProperty(D,Symbol.toStringTag,{value:"Module"})});
45
+ }
46
+ `).join(""):""}
47
+ `)}}),L.jsx("div",{ref:O,className:"ReactSpringCarouselTrack","data-part":"Track","data-part-internal":`${n}-Track`,onScroll:()=>{I.current=!1,k.current=!1},children:St.map((i,f)=>L.jsx("div",{className:"ReactSpringCarouselItem","data-part":"Item","data-part-internal":`${n}-Item`,"data-id":i.id,children:typeof i.renderItem=="function"?i.renderItem({useListenToCustomEvent:Ee,index:f,isClonedItem:!!i.isClonedItem,isActiveItem:Dt}):i.renderItem},`${i.id}-${f}`))})]}),useListenToCustomEvent:Ee,slideToNextItem:()=>Z(),slideToPrevItem:()=>ee(),slideToItem:i=>{if(typeof i=="number"){if(!e[i]){console.warn(`The item you're trying to slide doesn't exist. index: ${i}`);return}i>d.current?Z(i):ee(i)}if(typeof i=="string"){const f=e.findIndex(_=>_.id===i);if(f<0){console.warn(`The item you're trying to slide doesn't exist. id: ${i}`);return}f>d.current?Z(f):ee(f)}}}}function Et(t){let e=0;const r=getComputedStyle(t).getPropertyValue("gap");return r.includes("px")&&(e=Number(r.replace("px",""))),e}function we(t){return t.scrollWidth-t.clientWidth}function J(t){const e=t.children[0],r=Et(t);return e.getBoundingClientRect().width+r}function Tt({container:t,onReach:e}){const r=m.useRef("start"),n=m.useRef(0),[,s]=re.useSpring(()=>({x:0}));function o(c){s.start({from:{x:t.current.scrollLeft},to:{x:c},onChange({value:l}){t.current&&(t.current.scrollLeft=l.x)}})}function a(c){if(!t.current||c==="next"&&r.current==="end"||c==="prev"&&r.current==="start")return;let l=0;if(c==="next"&&(n.current+=1),c==="prev"&&(n.current-=1),l=n.current*J(t.current),c==="next"){const h=we(t.current);l>h&&(r.current="end",l=h,e&&e("end"))}c==="prev"&&l<=0&&(r.current="start",n.current=0,l=0,e&&e("start")),o(l)}return m.useEffect(()=>{function c(){var T;const $=J(t.current),w=((T=[...t.current.children].at(0))==null?void 0:T.getBoundingClientRect().width)||0,E=Array(t.current.childElementCount).fill(0).map((I,k)=>({index:k,start:$*k,end:$*(k+1)})),O=t.current.scrollLeft+w,N=E.find(I=>O>=I.start&&O<I.end);n.current=(N==null?void 0:N.index)||0}function l(){s.stop()}function h($){const w=$.target;w.scrollLeft===0?(n.current=0,r.current="start",e&&e("start")):w.scrollLeft>=we(w)?(r.current="end",e&&e("end")):r.current!=="idle"&&(r.current="idle",e&&e("idle"))}let u,v=0;function g(){v=t.current.scrollLeft,clearTimeout(u),u=setTimeout(function(){t.current.scrollLeft===v&&c()},200)}if(t.current)return t.current.addEventListener("wheel",l,{passive:!0}),t.current.addEventListener("scroll",h),t.current.addEventListener("scroll",g),()=>{t.current&&(t.current.removeEventListener("scroll",g),t.current.removeEventListener("scroll",h),t.current.removeEventListener("wheel",l))}},[t,e]),m.useEffect(()=>{if(t.current){const c=new ResizeObserver(()=>{o(n.current*J(t.current))});return c.observe(t.current),()=>{c.disconnect()}}},[]),{scrollToNext(){a("next")},scrollToPrev(){a("prev")}}}A.useSpringCarousel=wt,A.useSpringScroll=Tt,Object.defineProperty(A,Symbol.toStringTag,{value:"Module"})});
package/dist/types.d.ts CHANGED
@@ -7,11 +7,15 @@ export type ResponsiveGutterItem = {
7
7
  breakpoint: number;
8
8
  gutter: number;
9
9
  startEndGutter?: number;
10
+ /** Optional custom media query. If undefined, defaults to min-width */
11
+ media?: string;
10
12
  };
11
13
  export type ResponsiveItemsPerSlideItem = {
12
14
  /** This will create a min-width media query */
13
15
  breakpoint: number;
14
16
  itemsPerSlide: number;
17
+ /** Optional custom media query. If undefined, defaults to min-width */
18
+ media?: string;
15
19
  };
16
20
  export type Item = {
17
21
  id: string;
package/dist/useSpringCarousel.d.ts CHANGED
@@ -4,7 +4,5 @@ export declare function useSpringCarousel({ init, items, withLoop, id, gutter, i
4
4
  useListenToCustomEvent: (eventHandler: import('./types').SpringCarouselEventsEventHandler) => void;
5
5
  slideToNextItem: () => void;
6
6
  slideToPrevItem: () => void;
7
- getGutter: () => number;
8
- getItemsPerSlide: () => number;
9
7
  slideToItem: (id: string | number) => void;
10
8
  };
package/dist/useSpringScroll.d.ts ADDED
@@ -0,0 +1,11 @@
1
+ import { RefObject } from 'react';
2
+ type Reach = "start" | "end" | "idle";
3
+ type Props = {
4
+ container: RefObject<HTMLDivElement | null>;
5
+ onReach?(type: Reach): void;
6
+ };
7
+ export declare function useSpringScroll({ container, onReach }: Props): {
8
+ scrollToNext(): void;
9
+ scrollToPrev(): void;
10
+ };
11
+ export {};
package/dist/utils.d.ts ADDED
@@ -0,0 +1,6 @@
1
+ /**
2
+ * Simple CSS minifier that removes unnecessary whitespace and comments
3
+ * @param css The CSS content to minify
4
+ * @returns The minified CSS string
5
+ */
6
+ export declare function minifyCSS(css: string): string;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "react-spring-carousel",
3
- "version": "3.0.0-beta-2.0.4",
3
+ "version": "3.0.0-beta-2.0.42",
4
4
  "type": "module",
5
5
  "license": "MIT",
6
6
  "main": "./dist/index.umd.js",
@@ -11,9 +11,9 @@
11
11
  ],
12
12
  "exports": {
13
13
  ".": {
14
- "import": "./dist/index.es.js",
14
+ "types": "./dist/index.d.ts",
15
15
  "require": "./dist/index.umd.js",
16
- "types": "./dist/index.d.ts"
16
+ "import": "./dist/index.es.js"
17
17
  }
18
18
  },
19
19
  "scripts": {
@@ -26,7 +26,7 @@
26
26
  "release:beta": "git push && npm run build && npm publish --tag beta"
27
27
  },
28
28
  "dependencies": {
29
- "@use-gesture/react": "^10.2.26"
29
+ "@use-gesture/react": "^10.3.1"
30
30
  },
31
31
  "peerDependencies": {
32
32
  "@react-spring/web": "^9.5.4",
@@ -34,35 +34,36 @@
34
34
  "react-dom": "^18.0.0 || ^19.0.0"
35
35
  },
36
36
  "devDependencies": {
37
- "@chromatic-com/storybook": "^3.2.2",
38
- "@eslint/js": "^9.9.0",
39
- "@storybook/addon-essentials": "^8.4.5",
40
- "@storybook/addon-interactions": "^8.4.5",
41
- "@storybook/addon-links": "^8.4.5",
42
- "@storybook/addon-onboarding": "^8.4.5",
43
- "@storybook/addon-webpack5-compiler-swc": "^2.1.0",
44
- "@storybook/blocks": "^8.4.5",
45
- "@storybook/react": "^8.4.5",
46
- "@storybook/react-vite": "^8.4.5",
47
- "@storybook/server": "^8.6.0",
48
- "@storybook/server-webpack5": "^8.6.0",
49
- "@storybook/test": "^8.4.5",
37
+ "@chromatic-com/storybook": "^3.2.6",
38
+ "@eslint/js": "^9.23.0",
39
+ "@storybook/addon-essentials": "^8.6.12",
40
+ "@storybook/addon-interactions": "^8.6.12",
41
+ "@storybook/addon-links": "^8.6.12",
42
+ "@storybook/addon-mdx-gfm": "^8.6.12",
43
+ "@storybook/addon-onboarding": "^8.6.12",
44
+ "@storybook/addon-webpack5-compiler-swc": "^3.0.0",
45
+ "@storybook/blocks": "^8.6.12",
46
+ "@storybook/react": "^8.6.12",
47
+ "@storybook/react-vite": "^8.6.12",
48
+ "@storybook/server": "^8.6.12",
49
+ "@storybook/server-webpack5": "^8.6.12",
50
+ "@storybook/test": "^8.6.12",
50
51
  "@trivago/prettier-plugin-sort-imports": "^5.2.2",
51
- "@types/node": "^22.7.9",
52
- "@types/react": "^18.3.3",
53
- "@types/react-dom": "^18.3.0",
54
- "@vitejs/plugin-react-swc": "^3.5.0",
55
- "eslint": "^9.9.0",
56
- "eslint-plugin-react-hooks": "^5.1.0-rc.0",
57
- "eslint-plugin-react-refresh": "^0.4.9",
58
- "eslint-plugin-storybook": "^0.11.1",
59
- "globals": "^15.9.0",
60
- "prettier": "^3.5.2",
61
- "storybook": "^8.4.5",
62
- "typescript": "^5.5.3",
63
- "typescript-eslint": "^8.0.1",
64
- "vite": "^5.4.1",
65
- "vite-plugin-dts": "^4.0.3"
52
+ "@types/node": "^22.14.0",
53
+ "@types/react": "^19.1.0",
54
+ "@types/react-dom": "^19.1.1",
55
+ "@vitejs/plugin-react-swc": "^3.8.1",
56
+ "eslint": "^9.23.0",
57
+ "eslint-plugin-react-hooks": "^5.2.0",
58
+ "eslint-plugin-react-refresh": "^0.4.19",
59
+ "eslint-plugin-storybook": "^0.12.0",
60
+ "globals": "^16.0.0",
61
+ "prettier": "^3.5.3",
62
+ "storybook": "^8.6.12",
63
+ "typescript": "^5.8.2",
64
+ "typescript-eslint": "^8.29.0",
65
+ "vite": "^6.2.5",
66
+ "vite-plugin-dts": "^4.5.3"
66
67
  },
67
68
  "eslintConfig": {
68
69
  "extends": [