react-simply-carousel 8.2.1 → 8.3.2
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.
- package/README.md +31 -30
- package/dist/index.d.ts +10 -1
- package/dist/index.esm.js +1 -1
- package/dist/index.js +1 -1
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -131,36 +131,37 @@ export default ReactSimplyCarouselExample;
|
|
|
131
131
|
|
|
132
132
|
## Props
|
|
133
133
|
|
|
134
|
-
| Name | Type | Default Value | Description
|
|
135
|
-
| ----------------------------------------------------------------- | ------------------------------------ | ----------------------------- |
|
|
136
|
-
| **activeSlideIndex** | number | | Index of active slide
|
|
137
|
-
| **activeSlideProps** | object | `{}` | DOM props for active slide element
|
|
138
|
-
| **autoplay** | boolean | `false` |
|
|
139
|
-
| **autoplayDirection** | string (`'forward'` or `'backward'`) | `'forward'` |
|
|
140
|
-
| **backwardBtnProps** | object | `{}` | DOM props for carousel backward nav button element (include boolean prop `show` (for toggle button render) and node prop `children` (for render button childrens))
|
|
141
|
-
| **children** | node | `null` | slides array
|
|
142
|
-
| **containerProps** | object | `{}` | DOM props for carousel container div element
|
|
143
|
-
| **delay** | number | `0` | Slide change delay (css transition delay) in ms
|
|
144
|
-
| **disableNavIfAllVisible** | boolean | `true` | Disable carousel nav if all slides is visible
|
|
145
|
-
| **easing** | string | `'linear'` | Slide change easing (css transition easing)
|
|
146
|
-
| **forwardBtnProps** | object | `{}` | DOM props for carousel forward nav button element (include boolean prop `show` (for toggle button render) and node prop `children` (for render button childrens))
|
|
147
|
-
| **hideNavIfAllVisible** | boolean | `true` | Hide nav buttons if all slides is visible
|
|
148
|
-
| **innerProps** | object | `{}` | DOM props for inner div element
|
|
149
|
-
| **itemsListProps** | object | `{}` | DOM props for items list div element
|
|
150
|
-
| **itemsToScroll** | number | `1` | How many slides to scroll at once
|
|
151
|
-
| **itemsToShow** | number | `0` (automaticaly calculated) | How many slides to show
|
|
152
|
-
| **onAfterChange** | function | `null` | activeSlideIndex change callback
|
|
153
|
-
| **onRequestChange** | function | | Callback to handle every time the active slide changes, receives the new active index as
|
|
154
|
-
| **responsiveProps** | Array of objects | `[]` | carousel props for different window width. For example: `[{minWidth: 768, maxWidth: 992, itemsToShow: 3}, {maxWidth: 767, itemsToShow: 1}]` will show only one slide when window width is less than 767px and show 3 slides when window width is >= 768px and < 992px
|
|
155
|
-
| **speed** | number | `0` | Carousel scroll speed (css transition speed) in ms
|
|
156
|
-
| **updateOnItemClick** | boolean | `false` | Update active item index after click on some slide
|
|
157
|
-
| **centerMode** (disabled if `infinite` prop disabled) | boolean | `false` | Align active slide to the center of the carousel container viewport
|
|
158
|
-
| **infinite** | boolean | `true` | Enable infinite loop scroll
|
|
159
|
-
| **disableNavIfEdgeVisible** (disabled if `infinite` prop enabled) | boolean | `true` | Disable carousel forward nav if last slide is visible / Disable carousel backward nav if first slide is visible
|
|
160
|
-
| **disableNavIfEdgeActive** | boolean | `true` | Disable carousel forward nav if activeSlideIndex === lastSlideIndex / Disable carousel backward nav if activeSlideIndex === 0
|
|
161
|
-
| **dotsNav** (experimental) | object | `{}` | Props for carousel dots. Includes `show` (boolean) property for toggle dots nav visibility, `containerProps` (DOM Props for dots nav wrapper div) property, `itemBtnProps` (DOM props for all dots nav buttons) property and `activeItemBtnProps` (DOM props for active dots nav button)
|
|
162
|
-
| **persistentChangeCallbacks** | boolean | `false` | Enable call `onRequestChange` prop even if activeSlideIndex equals new value
|
|
163
|
-
| **showSlidesBeforeInit**
|
|
134
|
+
| Name | Type | Default Value | Description |
|
|
135
|
+
| ----------------------------------------------------------------- | ------------------------------------ | ----------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
|
|
136
|
+
| **activeSlideIndex** | number | | Index of active slide |
|
|
137
|
+
| **activeSlideProps** | object | `{}` | DOM props for active slide element |
|
|
138
|
+
| **autoplay** | boolean | `false` | |
|
|
139
|
+
| **autoplayDirection** | string (`'forward'` or `'backward'`) | `'forward'` | |
|
|
140
|
+
| **backwardBtnProps** | object | `{}` | DOM props for carousel backward nav button element (include boolean prop `show` (for toggle button render) and node prop `children` (for render button childrens)) |
|
|
141
|
+
| **children** | node | `null` | slides array |
|
|
142
|
+
| **containerProps** | object | `{}` | DOM props for carousel container div element |
|
|
143
|
+
| **delay** | number | `0` | Slide change delay (css transition delay) in ms |
|
|
144
|
+
| **disableNavIfAllVisible** | boolean | `true` | Disable carousel nav if all slides is visible |
|
|
145
|
+
| **easing** | string | `'linear'` | Slide change easing (css transition easing) |
|
|
146
|
+
| **forwardBtnProps** | object | `{}` | DOM props for carousel forward nav button element (include boolean prop `show` (for toggle button render) and node prop `children` (for render button childrens)) |
|
|
147
|
+
| **hideNavIfAllVisible** | boolean | `true` | Hide nav buttons if all slides is visible |
|
|
148
|
+
| **innerProps** | object | `{}` | DOM props for inner div element |
|
|
149
|
+
| **itemsListProps** | object | `{}` | DOM props for items list div element |
|
|
150
|
+
| **itemsToScroll** | number | `1` | How many slides to scroll at once |
|
|
151
|
+
| **itemsToShow** | number | `0` (automaticaly calculated) | How many slides to show |
|
|
152
|
+
| **onAfterChange** | function | `null` | activeSlideIndex change callback |
|
|
153
|
+
| **onRequestChange** | function | | Callback to handle every time the active slide changes, receives the new active index as first argument and info about visible slides (`{`<br /> ` isFirstSlideVisible: boolean;`<br />`isLastSlideVisible: boolean;`<br />`visibleSlides: { slideIndex: number; isFullyVisible: boolean }[];`<br />`}`) as second. |
|
|
154
|
+
| **responsiveProps** | Array of objects | `[]` | carousel props for different window width. For example: `[{minWidth: 768, maxWidth: 992, itemsToShow: 3}, {maxWidth: 767, itemsToShow: 1}]` will show only one slide when window width is less than 767px and show 3 slides when window width is >= 768px and < 992px |
|
|
155
|
+
| **speed** | number | `0` | Carousel scroll speed (css transition speed) in ms |
|
|
156
|
+
| **updateOnItemClick** | boolean | `false` | Update active item index after click on some slide |
|
|
157
|
+
| **centerMode** (disabled if `infinite` prop disabled) | boolean | `false` | Align active slide to the center of the carousel container viewport |
|
|
158
|
+
| **infinite** | boolean | `true` | Enable infinite loop scroll |
|
|
159
|
+
| **disableNavIfEdgeVisible** (disabled if `infinite` prop enabled) | boolean | `true` | Disable carousel forward nav if last slide is visible / Disable carousel backward nav if first slide is visible |
|
|
160
|
+
| **disableNavIfEdgeActive** | boolean | `true` | Disable carousel forward nav if activeSlideIndex === lastSlideIndex / Disable carousel backward nav if activeSlideIndex === 0 |
|
|
161
|
+
| **dotsNav** (experimental) | object | `{}` | Props for carousel dots. Includes `show` (boolean) property for toggle dots nav visibility, `containerProps` (DOM Props for dots nav wrapper div) property, `itemBtnProps` (DOM props for all dots nav buttons) property and `activeItemBtnProps` (DOM props for active dots nav button) |
|
|
162
|
+
| **persistentChangeCallbacks** | boolean | `false` | Enable call `onRequestChange` prop even if activeSlideIndex equals new value |
|
|
163
|
+
| **showSlidesBeforeInit** (deprecated) | boolean | `true` | Show slides on very first (initial) carousel render |
|
|
164
|
+
| **visibleSlideProps** | object | `{}` | DOM props for visible slide element |
|
|
164
165
|
|
|
165
166
|
## Demo
|
|
166
167
|
|
package/dist/index.d.ts
CHANGED
|
@@ -9,9 +9,18 @@ declare type DotsNav = {
|
|
|
9
9
|
itemBtnProps?: ButtonHTMLAttributes<HTMLButtonElement>;
|
|
10
10
|
activeItemBtnProps?: ButtonHTMLAttributes<HTMLButtonElement>;
|
|
11
11
|
};
|
|
12
|
+
declare type VisibleSlidesState = {
|
|
13
|
+
isFirstSlideVisible: boolean;
|
|
14
|
+
isLastSlideVisible: boolean;
|
|
15
|
+
visibleSlides: {
|
|
16
|
+
slideIndex: number;
|
|
17
|
+
isFullyVisible: boolean;
|
|
18
|
+
}[];
|
|
19
|
+
};
|
|
12
20
|
declare type ReactSimplyCarouselStaticProps = {
|
|
13
21
|
activeSlideIndex: number;
|
|
14
22
|
activeSlideProps?: HTMLAttributes<any>;
|
|
23
|
+
visibleSlideProps?: HTMLAttributes<any>;
|
|
15
24
|
autoplay?: boolean;
|
|
16
25
|
autoplayDirection?: NavDirection;
|
|
17
26
|
backwardBtnProps?: NavBtnProps;
|
|
@@ -27,7 +36,7 @@ declare type ReactSimplyCarouselStaticProps = {
|
|
|
27
36
|
itemsToScroll?: number;
|
|
28
37
|
itemsToShow?: number;
|
|
29
38
|
onAfterChange?: (activeSlideIndex: number, deprecated_positionSlideIndex: number) => void;
|
|
30
|
-
onRequestChange: (newActiveSlideIndex: number) => void;
|
|
39
|
+
onRequestChange: (newActiveSlideIndex: number, newVisibleSlidesState: VisibleSlidesState) => void;
|
|
31
40
|
speed?: number;
|
|
32
41
|
updateOnItemClick?: boolean;
|
|
33
42
|
centerMode?: boolean;
|
package/dist/index.esm.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import e,{memo as t,useState as n,useRef as r,Children as o,useMemo as i,useCallback as c,useEffect as a}from"react";function u(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,r)}return n}function l(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?u(Object(n),!0).forEach((function(t){d(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):u(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}function d(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function s(){return s=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},s.apply(this,arguments)}function f(e,t){if(null==e)return{};var n,r,o=function(e,t){if(null==e)return{};var n,r,o={},i=Object.keys(e);for(r=0;r<i.length;r++)n=i[r],t.indexOf(n)>=0||(o[n]=e[n]);return o}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(r=0;r<i.length;r++)n=i[r],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n])}return o}function v(e,t){return function(e){if(Array.isArray(e))return e}(e)||function(e,t){var n=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null==n)return;var r,o,i=[],c=!0,a=!1;try{for(n=n.call(e);!(c=(r=n.next()).done)&&(i.push(r.value),!t||i.length!==t);c=!0);}catch(e){a=!0,o=e}finally{try{c||null==n.return||n.return()}finally{if(a)throw o}}return i}(e,t)||h(e,t)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function m(e){return function(e){if(Array.isArray(e))return p(e)}(e)||function(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}(e)||h(e)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function h(e,t){if(e){if("string"==typeof e)return p(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?p(e,t):void 0}}function p(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}var b=["responsiveProps"],y=["minWidth","maxWidth"],w=["style","onClickCapture"],g=["style"],E=["style","onTouchStart","onMouseDown","onTransitionEnd"],x=["children","show"],O=["children","show"],S=["className","style"],T=["className","onClick","style"],k=["props"];function j(t){var u=t.responsiveProps,d=void 0===u?[]:u,h=f(t,b),p=v(n(0),2),j=p[0],C=p[1],P=v(n(h.activeSlideIndex),2),L=P[0],I=P[1],M=r(null),W=r(null),A=r(null),N=r(0),D=r(!1),X=r(""),z=r(null),B=r(null),V=r(0),F=d.reduce((function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},n=t.minWidth,r=void 0===n?0:n,o=t.maxWidth,i=void 0===o?null:o,c=f(t,y);return j>r&&(!i||j<=i)?l(l({},e),c):e}),h),q=o.toArray(F.children),R=j?l(l({},F),{},{activeSlideIndex:Math.max(0,Math.min(F.activeSlideIndex,q.length-1)),itemsToShow:Math.min(q.length,F.itemsToShow||0),itemsToScroll:Math.min(q.length,F.itemsToScroll||1)}):h,U=R.containerProps,$=(U=void 0===U?{}:U).style,G=void 0===$?{}:$,H=U.onClickCapture,J=void 0===H?null:H,K=f(U,w),Q=R.innerProps,Y=(Q=void 0===Q?{}:Q).style,Z=void 0===Y?{}:Y,_=f(Q,g),ee=R.itemsListProps,te=(ee=void 0===ee?{}:ee).style,ne=void 0===te?{}:te,re=ee.onTouchStart,oe=void 0===re?null:re,ie=ee.onMouseDown,ce=void 0===ie?null:ie,ae=ee.onTransitionEnd,ue=void 0===ae?null:ae,le=f(ee,E),de=R.backwardBtnProps,se=(de=void 0===de?{}:de).children,fe=void 0===se?null:se,ve=de.show,me=void 0===ve||ve,he=f(de,x),pe=R.forwardBtnProps,be=(pe=void 0===pe?{}:pe).children,ye=void 0===be?null:be,we=pe.show,ge=void 0===we||we,Ee=f(pe,O),xe=R.activeSlideProps,Oe=(xe=void 0===xe?{}:xe).className,Se=void 0===Oe?"":Oe,Te=xe.style,ke=void 0===Te?{}:Te,je=f(xe,S),Ce=R.updateOnItemClick,Pe=void 0!==Ce&&Ce,Le=R.activeSlideIndex,Ie=R.onRequestChange,Me=R.speed,We=void 0===Me?0:Me,Ae=R.delay,Ne=void 0===Ae?0:Ae,De=R.easing,Xe=void 0===De?"linear":De,ze=R.itemsToShow,Be=void 0===ze?0:ze,Ve=R.itemsToScroll,Fe=void 0===Ve?1:Ve,qe=R.children,Re=R.onAfterChange,Ue=R.autoplay,$e=void 0!==Ue&&Ue,Ge=R.autoplayDirection,He=void 0===Ge?"forward":Ge,Je=R.disableNavIfAllVisible,Ke=void 0===Je||Je,Qe=R.hideNavIfAllVisible,Ye=void 0===Qe||Qe,Ze=R.centerMode,_e=void 0!==Ze&&Ze,et=R.infinite,tt=void 0===et||et,nt=R.disableNavIfEdgeVisible,rt=void 0===nt||nt,ot=R.disableNavIfEdgeActive,it=void 0===ot||ot,ct=R.dotsNav,at=void 0===ct?{}:ct,ut=R.persistentChangeCallbacks,lt=void 0!==ut&&ut,dt=R.showSlidesBeforeInit,st=void 0!==dt&&dt,ft=at||{},vt=ft.show,mt=void 0!==vt&&vt,ht=ft.containerProps,pt=void 0===ht?{}:ht,bt=ft.itemBtnProps,yt=void 0===bt?{}:bt,wt=ft.activeItemBtnProps,gt=void 0===wt?{}:wt,Et=j?m(A.current.children):[],xt=i((function(){return j?tt?Et.slice(q.length-L,q.length-L+q.length):Et:[]}),[L,q.length,j,tt,Et]),Ot=j?A.current.offsetWidth-W.current.offsetWidth:0,St=function(e){var t=xt.reduce((function(t,n,r){return r>=e?t:t+(n.offsetWidth||0)}),0);return tt?t:Math.min(Ot,t)},Tt=i((function(){return j&&Be?xt.reduce((function(e,t,n){return n>=Le&&n<Le+Be||n<Le&&n<Le+Be-xt.length?e+t.offsetWidth:e}),0):0}),[Le,Be,xt,j]),kt=o.count(qe)-1,jt=Be===q.length,Ct=Ye&&jt,Pt=Ke&&jt,Lt=Le-L!=0,It=j&&Lt&&tt?St(L):0,Mt=!j||!Lt&&tt?0:St(Le),Wt=j?xt[Le].offsetWidth:0,At=j&&(_e&&tt)?-(Math.min(Tt||W.current.offsetWidth,W.current.offsetWidth)-Wt)/2:0,Nt=i((function(){return tt&&j?A.current.offsetWidth/3:0}),[j,tt]),Dt=L-Le!=0&&A.current?"forward"===X.current.toLowerCase()&&Le<L?Nt:"backward"===X.current.toLowerCase()&&Le>L?-Nt:0:0,Xt=Lt&&(We||Ne)?"transform ".concat(We,"ms ").concat(Xe," ").concat(Ne,"ms"):"none",zt=Pt||!j?0:Mt-It+At+Dt+Nt,Bt=j?"translateX(-".concat(zt,"px)"):"none",Vt=c((function(e){if("forward"===e){var t=Le+Fe;return t>kt?tt?t-kt-1:Le:t}if("backward"===e){var n=Le-Fe;return n<0?tt?kt+1+n:Le:n}return Le}),[Le,Fe,kt,tt]),Ft=c((function(e,t){X.current=t,A.current.style.transition=We||Ne?"transform ".concat(We,"ms ").concat(Xe," ").concat(Ne,"ms"):"none",e!==Le||lt?(clearTimeout(z.current),Ie(e)):(N.current=0,D.current=!1,A.current.style.transform="translateX(-".concat(At+Nt+(tt?0:zt),"px)"))}),[lt,Le,At,Ne,Xe,We,Ie,Nt,tt,zt]),qt=c((function(){$e&&(clearTimeout(z.current),z.current=setTimeout((function(){Ft(Vt(He),He)}),Ne))}),[$e,He,Ft,Vt,Ne]),Rt=c((function(e){D.current&&(e.preventDefault(),e.stopPropagation(),J&&J(e))}),[J]),Ut=c((function(){Ft(Vt("backward"),"backward")}),[Ft,Vt]),$t=c((function(e){D.current=!0;var t=e.touches&&e.touches[0]?e.touches[0].clientX:e.clientX,n=N.current-t+At+Nt+(tt?0:zt),r=A.current.offsetWidth-W.current.offsetWidth,o=Math.max(Math.min(0,-n),-r);A.current.style.transition="none",A.current.style.transform="translateX(".concat(o,"px)")}),[At,Nt,tt,zt]),Gt=c((function(e){if(A.current.removeEventListener("mouseout",Gt),A.current.removeEventListener("dragstart",Gt),document.removeEventListener("mousemove",$t),document.removeEventListener("mouseup",Gt),document.removeEventListener("touchmove",$t),document.removeEventListener("touchend",Gt),D.current){var t=e.changedTouches&&e.changedTouches.length?e.changedTouches[e.changedTouches.length-1].clientX:e.clientX,n=N.current-t;n>Wt/2?Ft(Vt("forward"),"forward"):n<-Wt/2?Ft(Vt("backward"),"backward"):Ft(Le,"forward")}}),[Le,Wt,Ft,Vt,$t]),Ht=c((function(e){clearTimeout(z.current),D.current||(N.current=e.clientX,document.addEventListener("mousemove",$t),document.addEventListener("mouseup",Gt),A.current.addEventListener("mouseout",Gt),A.current.addEventListener("dragstart",Gt)),ce&&ce(e)}),[$t,Gt]),Jt=c((function(e){clearTimeout(z.current),D.current||(N.current=e.touches[0].clientX,document.addEventListener("touchmove",$t),document.addEventListener("touchend",Gt)),oe&&oe(e)}),[$t,Gt]),Kt=c((function(e){I(Le),ue&&ue(e)}),[Le]),Qt=c((function(){Ft(Vt("forward"),"forward")}),[Ft,Vt]),Yt=function(e,t,n){return e.map((function(e,r){var o=e.props,i=(o=void 0===o?{}:o).className,c=void 0===i?"":i,a=o.onClick,u=void 0===a?null:a,d=o.style,s=void 0===d?{}:d,v=f(o,T),m=f(e,k),h=tt?V.current>=q.length?"forward":"backward":r>=Le?"forward":"backward",p=r+t===Le,b="".concat(c," ").concat(h," ").concat(p?Se:""),y=l(l(l({},s),p?ke:{}),{},{boxSizing:"border-box",margin:0}),w=!n&&Pe?function(e){var t=e.direction,n=e.index,r=e.onClick;return function(e){Ft(n,t||(Le<n?"forward":"")||(Le>n?"backward":"")),r&&r(e)}}({direction:h,index:r+t,onClick:u}):u,g=l(l({role:"tabpanel",className:b,style:y,onClick:w},v),p?je:{});return V.current+=1,l({props:g},m)}))};return a((function(){return N.current=0,D.current=!1,X.current="",Le!==L?We||Ne||I(Le):(Re&&Re(Le,L),(tt||"forward"===He&&Le!==kt||"backward"===He&&0!==Le)&&qt()),function(){clearTimeout(z.current)}}),[L,Le,Re,We,Ne,qt,tt,kt,He]),a((function(){return j&&qt(),function(){clearTimeout(z.current)}}),[j]),a((function(){var e=A.current;function t(){clearTimeout(B.current),clearTimeout(z.current),B.current=setTimeout((function(){C(window.innerWidth)}),400)}return C(window.innerWidth),window.addEventListener("resize",t),function(){clearTimeout(B.current),window.removeEventListener("resize",t),document.removeEventListener("mousemove",$t),document.removeEventListener("mouseup",Gt),document.removeEventListener("touchmove",$t),document.removeEventListener("touchend",Gt),e.removeEventListener("mouseout",Gt),e.removeEventListener("dragstart",Gt)}}),[$t,Gt]),V.current=0,j&&(A.current.style.transform=Bt),e.createElement("div",s({onClickCapture:Rt,style:l({display:"flex",flexFlow:"row wrap",boxSizing:"border-box",justifyContent:"center",width:"100%"},G)},K,{ref:M}),me&&!Ct&&e.createElement("button",s({},he,{type:"button",onClick:(0===zt&&rt||0===Le&&it)&&!tt?void 0:Ut,disabled:"boolean"==typeof he.disabled?he.disabled:!(!(0===zt&&rt||0===Le&&it)||tt)}),fe),e.createElement("div",s({},_,{style:l(l({},Z),{},{display:"flex",boxSizing:"border-box",flexFlow:"row wrap",padding:"0",overflow:"hidden",maxWidth:Tt?"".concat(Tt,"px"):!Tt&&st||j&&!Tt?void 0:0,flex:!Tt&&st||j&&!Tt?"1 0":void 0}),ref:W}),e.createElement("div",s({},le,{style:l(l({},ne),{},{display:"flex",boxSizing:"border-box",outline:"none",transition:Xt,transform:Bt}),"data-transform":Bt,onTouchStart:Pt?void 0:Jt,onMouseDown:Pt?void 0:Ht,onTransitionEnd:We||Ne?Kt:void 0,tabIndex:-1,role:"presentation",ref:A}),!Pt&&tt&&Yt(q.slice(L),L),Yt(q,0,Pt),!Pt&&tt&&Yt(q,0),!Pt&&tt&&Yt(q.slice(0,L),0))),ge&&!Ct&&e.createElement("button",s({},Ee,{type:"button",onClick:(zt===Ot&&rt||Le===kt&&it)&&!tt?void 0:Qt,disabled:"boolean"==typeof Ee.disabled?Ee.disabled:!(!(zt===Ot&&rt||Le===kt&&it)||tt)}),ye),!!mt&&e.createElement("div",s({style:{width:"100%",display:"flex",justifyContent:"center"}},pt),Array.from({length:Math.ceil(q.length/Fe)}).map((function(t,n){return e.createElement("button",s({type:"button",key:n,title:"".concat(n)},yt,Math.min(n*Fe,q.length-1)===Le?gt:{},{onClick:function(){Ft(Math.min(n*Fe,q.length-1),Math.min(n*Fe,q.length-1)>Le?"forward":"backward")}}))}))))}var C=t(j);export{C as default};
|
|
1
|
+
import e,{memo as t,useState as n,useRef as r,Children as i,useCallback as o,useEffect as c}from"react";function d(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,r)}return n}function l(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?d(Object(n),!0).forEach((function(t){a(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):d(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}function a(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function s(){return s=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},s.apply(this,arguments)}function u(e,t){if(null==e)return{};var n,r,i=function(e,t){if(null==e)return{};var n,r,i={},o=Object.keys(e);for(r=0;r<o.length;r++)n=o[r],t.indexOf(n)>=0||(i[n]=e[n]);return i}(e,t);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);for(r=0;r<o.length;r++)n=o[r],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(i[n]=e[n])}return i}function m(e,t){return function(e){if(Array.isArray(e))return e}(e)||function(e,t){var n=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null==n)return;var r,i,o=[],c=!0,d=!1;try{for(n=n.call(e);!(c=(r=n.next()).done)&&(o.push(r.value),!t||o.length!==t);c=!0);}catch(e){d=!0,i=e}finally{try{c||null==n.return||n.return()}finally{if(d)throw i}}return o}(e,t)||v(e,t)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function f(e){return function(e){if(Array.isArray(e))return h(e)}(e)||function(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}(e)||v(e)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function v(e,t){if(e){if("string"==typeof e)return h(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?h(e,t):void 0}}function h(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}var b=["responsiveProps"],p=["minWidth","maxWidth"],y=["style","onClickCapture"],w=["style"],x=["style","onTouchStart","onMouseDown","onTransitionEnd"],g=["children","show"],S=["children","show"],E=["className","style"],T=["className","style"],I=["className","onClick","style"],O=["props"];function M(e){var t=e.infinite,n=e.correctionSlideIndex,r=e.prevCorrectionSlideIndex,i=e.itemsListDOMElement,o=e.curActiveSlideIndex,c=e.itemsToShow,d=e.innerDOMElement,l=e.centerMode,a=e.direction,s=e.disableNav,u=t?f(i.children).slice(i.children.length/3-r,i.children.length/3-r+i.children.length/3):f(i.children),m=u[o].offsetWidth,v=c?u.reduce((function(e,t,n){return n>=o&&n<o+c||n<o&&n<o+c-u.length?e+t.offsetWidth:e}),0):d.offsetWidth,h=i.offsetWidth-v,b=l&&t?-(v-m)/2:0,p=t?i.offsetWidth/3:0,y=n-o==0?0:"forward"===a&&o<n?p:"backward"===a&&o>n?-p:0,w=o-n!=0,x=function(e){var n=u.reduce((function(t,n,r){return r>=e?t:t+(n.offsetWidth||0)}),0);return t?n:Math.min(h,n)},g=w&&t?x(n):0,S=w||!t?x(o):0,E=s?0:S-g+b+y+p,T="translateX(-".concat(E,"px)"),I=t?p+b:Math.min(i.offsetWidth-v,u.reduce((function(e,t,n){return n<o?e+t.offsetWidth:e}),0)),O=I+v,M=t?[].concat(f(u.slice(o).map((function(e,t){return{slideIndex:t+o,htmlElement:e}}))),f(u.map((function(e,t){return{slideIndex:t,htmlElement:e}}))),f(u.map((function(e,t){return{slideIndex:t,htmlElement:e}}))),f(u.slice(0,o).map((function(e,t){return{slideIndex:t,htmlElement:e}})))):u.map((function(e,t){return{slideIndex:t,htmlElement:e}})),L=M.reduce((function(e,t){var n=t.slideIndex,r=t.htmlElement.offsetWidth;return(e.summ>=I&&e.summ<O||e.summ+r>I&&e.summ+r<=O)&&e.items.push({slideIndex:n,isFullyVisible:e.summ+r<=O&&e.summ>=I}),e.summ+=r,e}),{summ:0,items:[]}),C=!!L.items.find((function(e){return 0===e.slideIndex})),k=!!L.items.find((function(e){return e.slideIndex===u.length-1}));return{slidesHTMLElements:u,innerMaxWidth:v,itemsListMaxTranslateX:h,activeSlideWidth:m,offsetCorrectionForCenterMode:b,offsetCorrectionForInfiniteMode:p,itemsListTranslateX:E,itemsListTransform:T,visibleSlides:L.items,isFirstSlideVisible:C,isLastSlideVisible:k}}function L(t){var d=t.responsiveProps,a=void 0===d?[]:d,f=u(t,b),v=m(n(0),2),h=v[0],L=v[1],C=m(n(f.activeSlideIndex),2),k=C[0],P=C[1],j=r(null),W=r(null),A=r(null),D=r(0),N=r(!1),X=r(""),F=r(null),V=r(null),z=r(0),B=r(k),q=a.reduce((function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},n=t.minWidth,r=void 0===n?0:n,i=t.maxWidth,o=void 0===i?null:i,c=u(t,p);return h>r&&(!o||h<=o)?l(l({},e),c):e}),f),H=i.toArray(q.children),R=h?l(l({},q),{},{activeSlideIndex:Math.max(0,Math.min(q.activeSlideIndex,H.length-1)),itemsToShow:Math.min(H.length,q.itemsToShow||0),itemsToScroll:Math.min(H.length,q.itemsToScroll||1)}):f,U=R.containerProps,$=(U=void 0===U?{}:U).style,G=void 0===$?{}:$,J=U.onClickCapture,K=void 0===J?null:J,Q=u(U,y),Y=R.innerProps,Z=(Y=void 0===Y?{}:Y).style,_=void 0===Z?{}:Z,ee=u(Y,w),te=R.itemsListProps,ne=(te=void 0===te?{}:te).style,re=void 0===ne?{}:ne,ie=te.onTouchStart,oe=void 0===ie?null:ie,ce=te.onMouseDown,de=void 0===ce?null:ce,le=te.onTransitionEnd,ae=void 0===le?null:le,se=u(te,x),ue=R.backwardBtnProps,me=(ue=void 0===ue?{}:ue).children,fe=void 0===me?null:me,ve=ue.show,he=void 0===ve||ve,be=u(ue,g),pe=R.forwardBtnProps,ye=(pe=void 0===pe?{}:pe).children,we=void 0===ye?null:ye,xe=pe.show,ge=void 0===xe||xe,Se=u(pe,S),Ee=R.activeSlideProps,Te=(Ee=void 0===Ee?{}:Ee).className,Ie=void 0===Te?"":Te,Oe=Ee.style,Me=void 0===Oe?{}:Oe,Le=u(Ee,E),Ce=R.visibleSlideProps,ke=(Ce=void 0===Ce?{}:Ce).className,Pe=void 0===ke?"":ke,je=Ce.style,We=void 0===je?{}:je,Ae=u(Ce,T),De=R.updateOnItemClick,Ne=void 0!==De&&De,Xe=R.activeSlideIndex,Fe=R.onRequestChange,Ve=R.speed,ze=void 0===Ve?0:Ve,Be=R.delay,qe=void 0===Be?0:Be,He=R.easing,Re=void 0===He?"linear":He,Ue=R.itemsToShow,$e=void 0===Ue?0:Ue,Ge=R.itemsToScroll,Je=void 0===Ge?1:Ge,Ke=R.children,Qe=R.onAfterChange,Ye=R.autoplay,Ze=void 0!==Ye&&Ye,_e=R.autoplayDirection,et=void 0===_e?"forward":_e,tt=R.disableNavIfAllVisible,nt=void 0===tt||tt,rt=R.hideNavIfAllVisible,it=void 0===rt||rt,ot=R.centerMode,ct=void 0!==ot&&ot,dt=R.infinite,lt=void 0===dt||dt,at=R.disableNavIfEdgeVisible,st=void 0===at||at,ut=R.disableNavIfEdgeActive,mt=void 0===ut||ut,ft=R.dotsNav,vt=void 0===ft?{}:ft,ht=R.persistentChangeCallbacks,bt=void 0!==ht&&ht,pt=vt||{},yt=pt.show,wt=void 0!==yt&&yt,xt=pt.containerProps,gt=void 0===xt?{}:xt,St=pt.itemBtnProps,Et=void 0===St?{}:St,Tt=pt.activeItemBtnProps,It=void 0===Tt?{}:Tt,Ot=i.count(Ke)-1,Mt=$e===H.length,Lt=it&&Mt,Ct=nt&&Mt,kt=Xe-k==0||!ze&&!qe?"none":"transform ".concat(ze,"ms ").concat(Re," ").concat(qe,"ms"),Pt=h?M({infinite:lt,itemsListDOMElement:A.current,prevCorrectionSlideIndex:B.current,itemsToShow:$e,curActiveSlideIndex:Xe,innerDOMElement:W.current,centerMode:ct,correctionSlideIndex:k,direction:X.current,disableNav:Ct}):{},jt=Pt.innerMaxWidth,Wt=void 0===jt?0:jt,At=Pt.itemsListMaxTranslateX,Dt=void 0===At?0:At,Nt=Pt.activeSlideWidth,Xt=void 0===Nt?0:Nt,Ft=Pt.offsetCorrectionForCenterMode,Vt=void 0===Ft?0:Ft,zt=Pt.offsetCorrectionForInfiniteMode,Bt=void 0===zt?0:zt,qt=Pt.itemsListTranslateX,Ht=void 0===qt?0:qt,Rt=Pt.itemsListTransform,Ut=void 0===Rt?"none":Rt,$t=Pt.visibleSlides,Gt=void 0===$t?[]:$t,Jt=o((function(e){if("forward"===e){var t=Xe+Je;return t>Ot?lt?t-Ot-1:Xe:t}if("backward"===e){var n=Xe-Je;return n<0?lt?Ot+1+n:Xe:n}return Xe}),[Xe,Je,Ot,lt]),Kt=o((function(e,t){if(X.current=t,A.current.style.transition=ze||qe?"transform ".concat(ze,"ms ").concat(Re," ").concat(qe,"ms"):"none",e!==Xe||bt){clearTimeout(F.current);var n=M({infinite:lt,correctionSlideIndex:k,prevCorrectionSlideIndex:k,curActiveSlideIndex:e,itemsToShow:$e,itemsListDOMElement:A.current,innerDOMElement:W.current,centerMode:ct,disableNav:Ct,direction:X.current}),r=n.visibleSlides,i=n.isFirstSlideVisible,o=n.isLastSlideVisible;Fe(e,{visibleSlides:r,isFirstSlideVisible:i,isLastSlideVisible:o})}else D.current=0,A.current.style.transform="translateX(-".concat(Vt+Bt+(lt?0:Ht),"px)")}),[bt,Xe,Vt,qe,Re,ze,Fe,Bt,lt,Ht,k,$e,ct,Ct]),Qt=o((function(){Ze&&(clearTimeout(F.current),F.current=setTimeout((function(){Kt(Jt(et),et)}),qe))}),[Ze,et,Kt,Jt,qe]),Yt=o((function(e){N.current&&(e.preventDefault(),e.stopPropagation(),K&&K(e))}),[K]),Zt=o((function(){Kt(Jt("backward"),"backward")}),[Kt,Jt]),_t=o((function(e){N.current=!0;var t=e.touches&&e.touches[0]?e.touches[0].clientX:e.clientX,n=D.current-t+Vt+Bt+(lt?0:Ht),r=A.current.offsetWidth-W.current.offsetWidth,i=Math.max(Math.min(0,-n),-r);A.current.style.transition="none",A.current.style.transform="translateX(".concat(i,"px)")}),[Vt,Bt,lt,Ht]),en=o((function(e){if(A.current.removeEventListener("mouseout",en),A.current.removeEventListener("dragstart",en),document.removeEventListener("mousemove",_t),document.removeEventListener("mouseup",en),document.removeEventListener("touchmove",_t),document.removeEventListener("touchend",en),N.current){var t=e.changedTouches&&e.changedTouches.length?e.changedTouches[e.changedTouches.length-1].clientX:e.clientX,n=D.current-t,r=n>Xt/2?{index:Jt("forward"),direction:"forward"}:n<-Xt/2?{index:Jt("backward"),direction:"backward"}:{index:Xe,direction:"forward"};r.index===Xe&&(N.current=!1),Kt(r.index,r.direction)}}),[Xe,Xt,Kt,Jt,_t]),tn=o((function(e){clearTimeout(F.current),N.current||(D.current=e.clientX,document.addEventListener("mousemove",_t),document.addEventListener("mouseup",en),A.current.addEventListener("mouseout",en),A.current.addEventListener("dragstart",en)),de&&de(e)}),[_t,en,de]),nn=o((function(e){clearTimeout(F.current),N.current||(D.current=e.touches[0].clientX,document.addEventListener("touchmove",_t),document.addEventListener("touchend",en)),oe&&oe(e)}),[_t,en,oe]),rn=o((function(e){P(Xe),ae&&ae(e)}),[Xe,ae]),on=o((function(){Kt(Jt("forward"),"forward")}),[Kt,Jt]),cn=function(e,t,n){return e.map((function(e,r){var i=e.props,o=(i=void 0===i?{}:i).className,c=void 0===o?"":o,d=i.onClick,a=void 0===d?null:d,s=i.style,m=void 0===s?{}:s,f=u(i,I),v=u(e,O),h=lt?z.current>=H.length?"forward":"backward":r>=Xe?"forward":"backward",b=r+t===Xe,p=Gt.find((function(e){return e.slideIndex===r+t})),y="".concat(c," ").concat(h," ").concat(b?Ie:""," ").concat(p?Pe:""),w=l(l(l(l({},m),p?We:{}),b?Me:{}),{},{boxSizing:"border-box",margin:0}),x=!n&&Ne?function(e){var t=e.direction,n=e.index,r=e.onClick;return function(e){Kt(n,t||(Xe<n?"forward":"")||(Xe>n?"backward":"")),r&&r(e)}}({direction:h,index:r+t,onClick:a}):a,g=l(l(l({role:"tabpanel",className:y,style:w,onClick:x},f),p?Ae:{}),b?Le:{});return z.current+=1,l({props:g},v)}))};return c((function(){return D.current=0,k===Xe&&(N.current=!1),X.current="",Xe!==k?ze||qe||P(Xe):(Qe&&Qe(Xe,k),(lt||"forward"===et&&Xe!==Ot||"backward"===et&&0!==Xe)&&Qt()),function(){clearTimeout(F.current)}}),[k,Xe,Qe,ze,qe,Qt,lt,Ot,et]),c((function(){return h&&Qt(),function(){clearTimeout(F.current)}}),[h]),c((function(){var e=A.current;function t(){clearTimeout(V.current),clearTimeout(F.current),V.current=setTimeout((function(){h!==window.innerWidth&&L(window.innerWidth)}),400)}return h!==window.innerWidth&&L(window.innerWidth),window.addEventListener("resize",t),function(){clearTimeout(V.current),window.removeEventListener("resize",t),document.removeEventListener("mousemove",_t),document.removeEventListener("mouseup",en),document.removeEventListener("touchmove",_t),document.removeEventListener("touchend",en),e.removeEventListener("mouseout",en),e.removeEventListener("dragstart",en)}}),[_t,en]),z.current=0,B.current=k,e.createElement("div",s({onClickCapture:Yt,style:l({display:"flex",flexFlow:"row wrap",boxSizing:"border-box",justifyContent:"center",width:"100%"},G)},Q,{ref:j}),he&&!Lt&&e.createElement("button",s({},be,{type:"button",onClick:(0===Ht&&st||0===Xe&&mt)&&!lt?void 0:Zt,disabled:"boolean"==typeof be.disabled?be.disabled:!(!(0===Ht&&st||0===Xe&&mt)||lt)}),fe),e.createElement("div",s({},ee,{style:l(l({},_),{},{display:"flex",boxSizing:"border-box",flexFlow:"row wrap",padding:"0",overflow:"hidden",maxWidth:Wt?"".concat(Wt,"px"):void 0,flex:Wt?void 0:"1 0"}),ref:W}),e.createElement("div",s({},se,{style:l(l({},re),{},{display:"flex",boxSizing:"border-box",outline:"none",transition:kt,transform:Ut}),onTouchStart:Ct?void 0:nn,onMouseDown:Ct?void 0:tn,onTransitionEnd:ze||qe?rn:void 0,tabIndex:-1,role:"presentation",ref:A}),lt&&cn(H.slice(k),k,Ct),cn(H,0,Ct),lt&&cn(H,0,Ct),lt&&cn(H.slice(0,k),0,Ct))),ge&&!Lt&&e.createElement("button",s({},Se,{type:"button",onClick:(Ht===Dt&&st||Xe===Ot&&mt)&&!lt?void 0:on,disabled:"boolean"==typeof Se.disabled?Se.disabled:!(!(Ht===Dt&&st||Xe===Ot&&mt)||lt)}),we),!!wt&&e.createElement("div",s({style:{width:"100%",display:"flex",justifyContent:"center"}},gt),Array.from({length:Math.ceil(H.length/Je)}).map((function(t,n){return e.createElement("button",s({type:"button",key:n,title:"".concat(n)},Et,Math.min(n*Je,H.length-1)===Xe?It:{},{onClick:function(){Kt(Math.min(n*Je,H.length-1),Math.min(n*Je,H.length-1)>Xe?"forward":"backward")}}))}))))}var C=t(L);export{C as default};
|
package/dist/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t(require("react")):"function"==typeof define&&define.amd?define(["react"],t):(e="undefined"!=typeof globalThis?globalThis:e||self).ReactSimplyCarousel=t(e.React)}(this,(function(e){"use strict";function t(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var n=t(e);function r(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,r)}return n}function o(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?r(Object(n),!0).forEach((function(t){i(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):r(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}function i(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function a(){return a=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},a.apply(this,arguments)}function c(e,t){if(null==e)return{};var n,r,o=function(e,t){if(null==e)return{};var n,r,o={},i=Object.keys(e);for(r=0;r<i.length;r++)n=i[r],t.indexOf(n)>=0||(o[n]=e[n]);return o}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(r=0;r<i.length;r++)n=i[r],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n])}return o}function u(e,t){return function(e){if(Array.isArray(e))return e}(e)||function(e,t){var n=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null==n)return;var r,o,i=[],a=!0,c=!1;try{for(n=n.call(e);!(a=(r=n.next()).done)&&(i.push(r.value),!t||i.length!==t);a=!0);}catch(e){c=!0,o=e}finally{try{a||null==n.return||n.return()}finally{if(c)throw o}}return i}(e,t)||d(e,t)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function l(e){return function(e){if(Array.isArray(e))return s(e)}(e)||function(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}(e)||d(e)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function d(e,t){if(e){if("string"==typeof e)return s(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?s(e,t):void 0}}function s(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}var f=["responsiveProps"],v=["minWidth","maxWidth"],m=["style","onClickCapture"],h=["style"],b=["style","onTouchStart","onMouseDown","onTransitionEnd"],p=["children","show"],y=["children","show"],w=["className","style"],g=["className","onClick","style"],E=["props"];function k(t){var r=t.responsiveProps,i=void 0===r?[]:r,d=c(t,f),s=u(e.useState(0),2),k=s[0],C=s[1],x=u(e.useState(d.activeSlideIndex),2),S=x[0],O=x[1],T=e.useRef(null),j=e.useRef(null),P=e.useRef(null),L=e.useRef(0),M=e.useRef(!1),I=e.useRef(""),W=e.useRef(null),A=e.useRef(null),R=e.useRef(0),N=i.reduce((function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},n=t.minWidth,r=void 0===n?0:n,i=t.maxWidth,a=void 0===i?null:i,u=c(t,v);return k>r&&(!a||k<=a)?o(o({},e),u):e}),d),D=e.Children.toArray(N.children),X=k?o(o({},N),{},{activeSlideIndex:Math.max(0,Math.min(N.activeSlideIndex,D.length-1)),itemsToShow:Math.min(D.length,N.itemsToShow||0),itemsToScroll:Math.min(D.length,N.itemsToScroll||1)}):d,z=X.containerProps,B=(z=void 0===z?{}:z).style,V=void 0===B?{}:B,q=z.onClickCapture,F=void 0===q?null:q,U=c(z,m),$=X.innerProps,G=($=void 0===$?{}:$).style,H=void 0===G?{}:G,J=c($,h),K=X.itemsListProps,Q=(K=void 0===K?{}:K).style,Y=void 0===Q?{}:Q,Z=K.onTouchStart,_=void 0===Z?null:Z,ee=K.onMouseDown,te=void 0===ee?null:ee,ne=K.onTransitionEnd,re=void 0===ne?null:ne,oe=c(K,b),ie=X.backwardBtnProps,ae=(ie=void 0===ie?{}:ie).children,ce=void 0===ae?null:ae,ue=ie.show,le=void 0===ue||ue,de=c(ie,p),se=X.forwardBtnProps,fe=(se=void 0===se?{}:se).children,ve=void 0===fe?null:fe,me=se.show,he=void 0===me||me,be=c(se,y),pe=X.activeSlideProps,ye=(pe=void 0===pe?{}:pe).className,we=void 0===ye?"":ye,ge=pe.style,Ee=void 0===ge?{}:ge,ke=c(pe,w),Ce=X.updateOnItemClick,xe=void 0!==Ce&&Ce,Se=X.activeSlideIndex,Oe=X.onRequestChange,Te=X.speed,je=void 0===Te?0:Te,Pe=X.delay,Le=void 0===Pe?0:Pe,Me=X.easing,Ie=void 0===Me?"linear":Me,We=X.itemsToShow,Ae=void 0===We?0:We,Re=X.itemsToScroll,Ne=void 0===Re?1:Re,De=X.children,Xe=X.onAfterChange,ze=X.autoplay,Be=void 0!==ze&&ze,Ve=X.autoplayDirection,qe=void 0===Ve?"forward":Ve,Fe=X.disableNavIfAllVisible,Ue=void 0===Fe||Fe,$e=X.hideNavIfAllVisible,Ge=void 0===$e||$e,He=X.centerMode,Je=void 0!==He&&He,Ke=X.infinite,Qe=void 0===Ke||Ke,Ye=X.disableNavIfEdgeVisible,Ze=void 0===Ye||Ye,_e=X.disableNavIfEdgeActive,et=void 0===_e||_e,tt=X.dotsNav,nt=void 0===tt?{}:tt,rt=X.persistentChangeCallbacks,ot=void 0!==rt&&rt,it=X.showSlidesBeforeInit,at=void 0!==it&&it,ct=nt||{},ut=ct.show,lt=void 0!==ut&&ut,dt=ct.containerProps,st=void 0===dt?{}:dt,ft=ct.itemBtnProps,vt=void 0===ft?{}:ft,mt=ct.activeItemBtnProps,ht=void 0===mt?{}:mt,bt=k?l(P.current.children):[],pt=e.useMemo((function(){return k?Qe?bt.slice(D.length-S,D.length-S+D.length):bt:[]}),[S,D.length,k,Qe,bt]),yt=k?P.current.offsetWidth-j.current.offsetWidth:0,wt=function(e){var t=pt.reduce((function(t,n,r){return r>=e?t:t+(n.offsetWidth||0)}),0);return Qe?t:Math.min(yt,t)},gt=e.useMemo((function(){return k&&Ae?pt.reduce((function(e,t,n){return n>=Se&&n<Se+Ae||n<Se&&n<Se+Ae-pt.length?e+t.offsetWidth:e}),0):0}),[Se,Ae,pt,k]),Et=e.Children.count(De)-1,kt=Ae===D.length,Ct=Ge&&kt,xt=Ue&&kt,St=Se-S!=0,Ot=k&&St&&Qe?wt(S):0,Tt=!k||!St&&Qe?0:wt(Se),jt=k?pt[Se].offsetWidth:0,Pt=k&&(Je&&Qe)?-(Math.min(gt||j.current.offsetWidth,j.current.offsetWidth)-jt)/2:0,Lt=e.useMemo((function(){return Qe&&k?P.current.offsetWidth/3:0}),[k,Qe]),Mt=S-Se!=0&&P.current?"forward"===I.current.toLowerCase()&&Se<S?Lt:"backward"===I.current.toLowerCase()&&Se>S?-Lt:0:0,It=St&&(je||Le)?"transform ".concat(je,"ms ").concat(Ie," ").concat(Le,"ms"):"none",Wt=xt||!k?0:Tt-Ot+Pt+Mt+Lt,At=k?"translateX(-".concat(Wt,"px)"):"none",Rt=e.useCallback((function(e){if("forward"===e){var t=Se+Ne;return t>Et?Qe?t-Et-1:Se:t}if("backward"===e){var n=Se-Ne;return n<0?Qe?Et+1+n:Se:n}return Se}),[Se,Ne,Et,Qe]),Nt=e.useCallback((function(e,t){I.current=t,P.current.style.transition=je||Le?"transform ".concat(je,"ms ").concat(Ie," ").concat(Le,"ms"):"none",e!==Se||ot?(clearTimeout(W.current),Oe(e)):(L.current=0,M.current=!1,P.current.style.transform="translateX(-".concat(Pt+Lt+(Qe?0:Wt),"px)"))}),[ot,Se,Pt,Le,Ie,je,Oe,Lt,Qe,Wt]),Dt=e.useCallback((function(){Be&&(clearTimeout(W.current),W.current=setTimeout((function(){Nt(Rt(qe),qe)}),Le))}),[Be,qe,Nt,Rt,Le]),Xt=e.useCallback((function(e){M.current&&(e.preventDefault(),e.stopPropagation(),F&&F(e))}),[F]),zt=e.useCallback((function(){Nt(Rt("backward"),"backward")}),[Nt,Rt]),Bt=e.useCallback((function(e){M.current=!0;var t=e.touches&&e.touches[0]?e.touches[0].clientX:e.clientX,n=L.current-t+Pt+Lt+(Qe?0:Wt),r=P.current.offsetWidth-j.current.offsetWidth,o=Math.max(Math.min(0,-n),-r);P.current.style.transition="none",P.current.style.transform="translateX(".concat(o,"px)")}),[Pt,Lt,Qe,Wt]),Vt=e.useCallback((function(e){if(P.current.removeEventListener("mouseout",Vt),P.current.removeEventListener("dragstart",Vt),document.removeEventListener("mousemove",Bt),document.removeEventListener("mouseup",Vt),document.removeEventListener("touchmove",Bt),document.removeEventListener("touchend",Vt),M.current){var t=e.changedTouches&&e.changedTouches.length?e.changedTouches[e.changedTouches.length-1].clientX:e.clientX,n=L.current-t;n>jt/2?Nt(Rt("forward"),"forward"):n<-jt/2?Nt(Rt("backward"),"backward"):Nt(Se,"forward")}}),[Se,jt,Nt,Rt,Bt]),qt=e.useCallback((function(e){clearTimeout(W.current),M.current||(L.current=e.clientX,document.addEventListener("mousemove",Bt),document.addEventListener("mouseup",Vt),P.current.addEventListener("mouseout",Vt),P.current.addEventListener("dragstart",Vt)),te&&te(e)}),[Bt,Vt]),Ft=e.useCallback((function(e){clearTimeout(W.current),M.current||(L.current=e.touches[0].clientX,document.addEventListener("touchmove",Bt),document.addEventListener("touchend",Vt)),_&&_(e)}),[Bt,Vt]),Ut=e.useCallback((function(e){O(Se),re&&re(e)}),[Se]),$t=e.useCallback((function(){Nt(Rt("forward"),"forward")}),[Nt,Rt]),Gt=function(e,t,n){return e.map((function(e,r){var i=e.props,a=(i=void 0===i?{}:i).className,u=void 0===a?"":a,l=i.onClick,d=void 0===l?null:l,s=i.style,f=void 0===s?{}:s,v=c(i,g),m=c(e,E),h=Qe?R.current>=D.length?"forward":"backward":r>=Se?"forward":"backward",b=r+t===Se,p="".concat(u," ").concat(h," ").concat(b?we:""),y=o(o(o({},f),b?Ee:{}),{},{boxSizing:"border-box",margin:0}),w=!n&&xe?function(e){var t=e.direction,n=e.index,r=e.onClick;return function(e){Nt(n,t||(Se<n?"forward":"")||(Se>n?"backward":"")),r&&r(e)}}({direction:h,index:r+t,onClick:d}):d,k=o(o({role:"tabpanel",className:p,style:y,onClick:w},v),b?ke:{});return R.current+=1,o({props:k},m)}))};return e.useEffect((function(){return L.current=0,M.current=!1,I.current="",Se!==S?je||Le||O(Se):(Xe&&Xe(Se,S),(Qe||"forward"===qe&&Se!==Et||"backward"===qe&&0!==Se)&&Dt()),function(){clearTimeout(W.current)}}),[S,Se,Xe,je,Le,Dt,Qe,Et,qe]),e.useEffect((function(){return k&&Dt(),function(){clearTimeout(W.current)}}),[k]),e.useEffect((function(){var e=P.current;function t(){clearTimeout(A.current),clearTimeout(W.current),A.current=setTimeout((function(){C(window.innerWidth)}),400)}return C(window.innerWidth),window.addEventListener("resize",t),function(){clearTimeout(A.current),window.removeEventListener("resize",t),document.removeEventListener("mousemove",Bt),document.removeEventListener("mouseup",Vt),document.removeEventListener("touchmove",Bt),document.removeEventListener("touchend",Vt),e.removeEventListener("mouseout",Vt),e.removeEventListener("dragstart",Vt)}}),[Bt,Vt]),R.current=0,k&&(P.current.style.transform=At),n.default.createElement("div",a({onClickCapture:Xt,style:o({display:"flex",flexFlow:"row wrap",boxSizing:"border-box",justifyContent:"center",width:"100%"},V)},U,{ref:T}),le&&!Ct&&n.default.createElement("button",a({},de,{type:"button",onClick:(0===Wt&&Ze||0===Se&&et)&&!Qe?void 0:zt,disabled:"boolean"==typeof de.disabled?de.disabled:!(!(0===Wt&&Ze||0===Se&&et)||Qe)}),ce),n.default.createElement("div",a({},J,{style:o(o({},H),{},{display:"flex",boxSizing:"border-box",flexFlow:"row wrap",padding:"0",overflow:"hidden",maxWidth:gt?"".concat(gt,"px"):!gt&&at||k&&!gt?void 0:0,flex:!gt&&at||k&&!gt?"1 0":void 0}),ref:j}),n.default.createElement("div",a({},oe,{style:o(o({},Y),{},{display:"flex",boxSizing:"border-box",outline:"none",transition:It,transform:At}),"data-transform":At,onTouchStart:xt?void 0:Ft,onMouseDown:xt?void 0:qt,onTransitionEnd:je||Le?Ut:void 0,tabIndex:-1,role:"presentation",ref:P}),!xt&&Qe&&Gt(D.slice(S),S),Gt(D,0,xt),!xt&&Qe&&Gt(D,0),!xt&&Qe&&Gt(D.slice(0,S),0))),he&&!Ct&&n.default.createElement("button",a({},be,{type:"button",onClick:(Wt===yt&&Ze||Se===Et&&et)&&!Qe?void 0:$t,disabled:"boolean"==typeof be.disabled?be.disabled:!(!(Wt===yt&&Ze||Se===Et&&et)||Qe)}),ve),!!lt&&n.default.createElement("div",a({style:{width:"100%",display:"flex",justifyContent:"center"}},st),Array.from({length:Math.ceil(D.length/Ne)}).map((function(e,t){return n.default.createElement("button",a({type:"button",key:t,title:"".concat(t)},vt,Math.min(t*Ne,D.length-1)===Se?ht:{},{onClick:function(){Nt(Math.min(t*Ne,D.length-1),Math.min(t*Ne,D.length-1)>Se?"forward":"backward")}}))}))))}return e.memo(k)}));
|
|
1
|
+
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t(require("react")):"function"==typeof define&&define.amd?define(["react"],t):(e="undefined"!=typeof globalThis?globalThis:e||self).ReactSimplyCarousel=t(e.React)}(this,(function(e){"use strict";function t(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var n=t(e);function r(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,r)}return n}function i(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?r(Object(n),!0).forEach((function(t){o(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):r(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}function o(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function c(){return c=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},c.apply(this,arguments)}function l(e,t){if(null==e)return{};var n,r,i=function(e,t){if(null==e)return{};var n,r,i={},o=Object.keys(e);for(r=0;r<o.length;r++)n=o[r],t.indexOf(n)>=0||(i[n]=e[n]);return i}(e,t);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);for(r=0;r<o.length;r++)n=o[r],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(i[n]=e[n])}return i}function a(e,t){return function(e){if(Array.isArray(e))return e}(e)||function(e,t){var n=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null==n)return;var r,i,o=[],c=!0,l=!1;try{for(n=n.call(e);!(c=(r=n.next()).done)&&(o.push(r.value),!t||o.length!==t);c=!0);}catch(e){l=!0,i=e}finally{try{c||null==n.return||n.return()}finally{if(l)throw i}}return o}(e,t)||u(e,t)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function d(e){return function(e){if(Array.isArray(e))return s(e)}(e)||function(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}(e)||u(e)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function u(e,t){if(e){if("string"==typeof e)return s(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?s(e,t):void 0}}function s(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}var f=["responsiveProps"],m=["minWidth","maxWidth"],v=["style","onClickCapture"],h=["style"],b=["style","onTouchStart","onMouseDown","onTransitionEnd"],p=["children","show"],y=["children","show"],w=["className","style"],x=["className","style"],g=["className","onClick","style"],S=["props"];function E(e){var t=e.infinite,n=e.correctionSlideIndex,r=e.prevCorrectionSlideIndex,i=e.itemsListDOMElement,o=e.curActiveSlideIndex,c=e.itemsToShow,l=e.innerDOMElement,a=e.centerMode,u=e.direction,s=e.disableNav,f=t?d(i.children).slice(i.children.length/3-r,i.children.length/3-r+i.children.length/3):d(i.children),m=f[o].offsetWidth,v=c?f.reduce((function(e,t,n){return n>=o&&n<o+c||n<o&&n<o+c-f.length?e+t.offsetWidth:e}),0):l.offsetWidth,h=i.offsetWidth-v,b=a&&t?-(v-m)/2:0,p=t?i.offsetWidth/3:0,y=n-o==0?0:"forward"===u&&o<n?p:"backward"===u&&o>n?-p:0,w=o-n!=0,x=function(e){var n=f.reduce((function(t,n,r){return r>=e?t:t+(n.offsetWidth||0)}),0);return t?n:Math.min(h,n)},g=w&&t?x(n):0,S=w||!t?x(o):0,E=s?0:S-g+b+y+p,C="translateX(-".concat(E,"px)"),T=t?p+b:Math.min(i.offsetWidth-v,f.reduce((function(e,t,n){return n<o?e+t.offsetWidth:e}),0)),k=T+v,I=t?[].concat(d(f.slice(o).map((function(e,t){return{slideIndex:t+o,htmlElement:e}}))),d(f.map((function(e,t){return{slideIndex:t,htmlElement:e}}))),d(f.map((function(e,t){return{slideIndex:t,htmlElement:e}}))),d(f.slice(0,o).map((function(e,t){return{slideIndex:t,htmlElement:e}})))):f.map((function(e,t){return{slideIndex:t,htmlElement:e}})),O=I.reduce((function(e,t){var n=t.slideIndex,r=t.htmlElement.offsetWidth;return(e.summ>=T&&e.summ<k||e.summ+r>T&&e.summ+r<=k)&&e.items.push({slideIndex:n,isFullyVisible:e.summ+r<=k&&e.summ>=T}),e.summ+=r,e}),{summ:0,items:[]}),M=!!O.items.find((function(e){return 0===e.slideIndex})),L=!!O.items.find((function(e){return e.slideIndex===f.length-1}));return{slidesHTMLElements:f,innerMaxWidth:v,itemsListMaxTranslateX:h,activeSlideWidth:m,offsetCorrectionForCenterMode:b,offsetCorrectionForInfiniteMode:p,itemsListTranslateX:E,itemsListTransform:C,visibleSlides:O.items,isFirstSlideVisible:M,isLastSlideVisible:L}}function C(t){var r=t.responsiveProps,o=void 0===r?[]:r,d=l(t,f),u=a(e.useState(0),2),s=u[0],C=u[1],T=a(e.useState(d.activeSlideIndex),2),k=T[0],I=T[1],O=e.useRef(null),M=e.useRef(null),L=e.useRef(null),j=e.useRef(0),P=e.useRef(!1),W=e.useRef(""),A=e.useRef(null),D=e.useRef(null),N=e.useRef(0),R=e.useRef(k),X=o.reduce((function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},n=t.minWidth,r=void 0===n?0:n,o=t.maxWidth,c=void 0===o?null:o,a=l(t,m);return s>r&&(!c||s<=c)?i(i({},e),a):e}),d),F=e.Children.toArray(X.children),V=s?i(i({},X),{},{activeSlideIndex:Math.max(0,Math.min(X.activeSlideIndex,F.length-1)),itemsToShow:Math.min(F.length,X.itemsToShow||0),itemsToScroll:Math.min(F.length,X.itemsToScroll||1)}):d,z=V.containerProps,B=(z=void 0===z?{}:z).style,q=void 0===B?{}:B,H=z.onClickCapture,U=void 0===H?null:H,$=l(z,v),G=V.innerProps,J=(G=void 0===G?{}:G).style,K=void 0===J?{}:J,Q=l(G,h),Y=V.itemsListProps,Z=(Y=void 0===Y?{}:Y).style,_=void 0===Z?{}:Z,ee=Y.onTouchStart,te=void 0===ee?null:ee,ne=Y.onMouseDown,re=void 0===ne?null:ne,ie=Y.onTransitionEnd,oe=void 0===ie?null:ie,ce=l(Y,b),le=V.backwardBtnProps,ae=(le=void 0===le?{}:le).children,de=void 0===ae?null:ae,ue=le.show,se=void 0===ue||ue,fe=l(le,p),me=V.forwardBtnProps,ve=(me=void 0===me?{}:me).children,he=void 0===ve?null:ve,be=me.show,pe=void 0===be||be,ye=l(me,y),we=V.activeSlideProps,xe=(we=void 0===we?{}:we).className,ge=void 0===xe?"":xe,Se=we.style,Ee=void 0===Se?{}:Se,Ce=l(we,w),Te=V.visibleSlideProps,ke=(Te=void 0===Te?{}:Te).className,Ie=void 0===ke?"":ke,Oe=Te.style,Me=void 0===Oe?{}:Oe,Le=l(Te,x),je=V.updateOnItemClick,Pe=void 0!==je&&je,We=V.activeSlideIndex,Ae=V.onRequestChange,De=V.speed,Ne=void 0===De?0:De,Re=V.delay,Xe=void 0===Re?0:Re,Fe=V.easing,Ve=void 0===Fe?"linear":Fe,ze=V.itemsToShow,Be=void 0===ze?0:ze,qe=V.itemsToScroll,He=void 0===qe?1:qe,Ue=V.children,$e=V.onAfterChange,Ge=V.autoplay,Je=void 0!==Ge&&Ge,Ke=V.autoplayDirection,Qe=void 0===Ke?"forward":Ke,Ye=V.disableNavIfAllVisible,Ze=void 0===Ye||Ye,_e=V.hideNavIfAllVisible,et=void 0===_e||_e,tt=V.centerMode,nt=void 0!==tt&&tt,rt=V.infinite,it=void 0===rt||rt,ot=V.disableNavIfEdgeVisible,ct=void 0===ot||ot,lt=V.disableNavIfEdgeActive,at=void 0===lt||lt,dt=V.dotsNav,ut=void 0===dt?{}:dt,st=V.persistentChangeCallbacks,ft=void 0!==st&&st,mt=ut||{},vt=mt.show,ht=void 0!==vt&&vt,bt=mt.containerProps,pt=void 0===bt?{}:bt,yt=mt.itemBtnProps,wt=void 0===yt?{}:yt,xt=mt.activeItemBtnProps,gt=void 0===xt?{}:xt,St=e.Children.count(Ue)-1,Et=Be===F.length,Ct=et&&Et,Tt=Ze&&Et,kt=We-k==0||!Ne&&!Xe?"none":"transform ".concat(Ne,"ms ").concat(Ve," ").concat(Xe,"ms"),It=s?E({infinite:it,itemsListDOMElement:L.current,prevCorrectionSlideIndex:R.current,itemsToShow:Be,curActiveSlideIndex:We,innerDOMElement:M.current,centerMode:nt,correctionSlideIndex:k,direction:W.current,disableNav:Tt}):{},Ot=It.innerMaxWidth,Mt=void 0===Ot?0:Ot,Lt=It.itemsListMaxTranslateX,jt=void 0===Lt?0:Lt,Pt=It.activeSlideWidth,Wt=void 0===Pt?0:Pt,At=It.offsetCorrectionForCenterMode,Dt=void 0===At?0:At,Nt=It.offsetCorrectionForInfiniteMode,Rt=void 0===Nt?0:Nt,Xt=It.itemsListTranslateX,Ft=void 0===Xt?0:Xt,Vt=It.itemsListTransform,zt=void 0===Vt?"none":Vt,Bt=It.visibleSlides,qt=void 0===Bt?[]:Bt,Ht=e.useCallback((function(e){if("forward"===e){var t=We+He;return t>St?it?t-St-1:We:t}if("backward"===e){var n=We-He;return n<0?it?St+1+n:We:n}return We}),[We,He,St,it]),Ut=e.useCallback((function(e,t){if(W.current=t,L.current.style.transition=Ne||Xe?"transform ".concat(Ne,"ms ").concat(Ve," ").concat(Xe,"ms"):"none",e!==We||ft){clearTimeout(A.current);var n=E({infinite:it,correctionSlideIndex:k,prevCorrectionSlideIndex:k,curActiveSlideIndex:e,itemsToShow:Be,itemsListDOMElement:L.current,innerDOMElement:M.current,centerMode:nt,disableNav:Tt,direction:W.current}),r=n.visibleSlides,i=n.isFirstSlideVisible,o=n.isLastSlideVisible;Ae(e,{visibleSlides:r,isFirstSlideVisible:i,isLastSlideVisible:o})}else j.current=0,L.current.style.transform="translateX(-".concat(Dt+Rt+(it?0:Ft),"px)")}),[ft,We,Dt,Xe,Ve,Ne,Ae,Rt,it,Ft,k,Be,nt,Tt]),$t=e.useCallback((function(){Je&&(clearTimeout(A.current),A.current=setTimeout((function(){Ut(Ht(Qe),Qe)}),Xe))}),[Je,Qe,Ut,Ht,Xe]),Gt=e.useCallback((function(e){P.current&&(e.preventDefault(),e.stopPropagation(),U&&U(e))}),[U]),Jt=e.useCallback((function(){Ut(Ht("backward"),"backward")}),[Ut,Ht]),Kt=e.useCallback((function(e){P.current=!0;var t=e.touches&&e.touches[0]?e.touches[0].clientX:e.clientX,n=j.current-t+Dt+Rt+(it?0:Ft),r=L.current.offsetWidth-M.current.offsetWidth,i=Math.max(Math.min(0,-n),-r);L.current.style.transition="none",L.current.style.transform="translateX(".concat(i,"px)")}),[Dt,Rt,it,Ft]),Qt=e.useCallback((function(e){if(L.current.removeEventListener("mouseout",Qt),L.current.removeEventListener("dragstart",Qt),document.removeEventListener("mousemove",Kt),document.removeEventListener("mouseup",Qt),document.removeEventListener("touchmove",Kt),document.removeEventListener("touchend",Qt),P.current){var t=e.changedTouches&&e.changedTouches.length?e.changedTouches[e.changedTouches.length-1].clientX:e.clientX,n=j.current-t,r=n>Wt/2?{index:Ht("forward"),direction:"forward"}:n<-Wt/2?{index:Ht("backward"),direction:"backward"}:{index:We,direction:"forward"};r.index===We&&(P.current=!1),Ut(r.index,r.direction)}}),[We,Wt,Ut,Ht,Kt]),Yt=e.useCallback((function(e){clearTimeout(A.current),P.current||(j.current=e.clientX,document.addEventListener("mousemove",Kt),document.addEventListener("mouseup",Qt),L.current.addEventListener("mouseout",Qt),L.current.addEventListener("dragstart",Qt)),re&&re(e)}),[Kt,Qt,re]),Zt=e.useCallback((function(e){clearTimeout(A.current),P.current||(j.current=e.touches[0].clientX,document.addEventListener("touchmove",Kt),document.addEventListener("touchend",Qt)),te&&te(e)}),[Kt,Qt,te]),_t=e.useCallback((function(e){I(We),oe&&oe(e)}),[We,oe]),en=e.useCallback((function(){Ut(Ht("forward"),"forward")}),[Ut,Ht]),tn=function(e,t,n){return e.map((function(e,r){var o=e.props,c=(o=void 0===o?{}:o).className,a=void 0===c?"":c,d=o.onClick,u=void 0===d?null:d,s=o.style,f=void 0===s?{}:s,m=l(o,g),v=l(e,S),h=it?N.current>=F.length?"forward":"backward":r>=We?"forward":"backward",b=r+t===We,p=qt.find((function(e){return e.slideIndex===r+t})),y="".concat(a," ").concat(h," ").concat(b?ge:""," ").concat(p?Ie:""),w=i(i(i(i({},f),p?Me:{}),b?Ee:{}),{},{boxSizing:"border-box",margin:0}),x=!n&&Pe?function(e){var t=e.direction,n=e.index,r=e.onClick;return function(e){Ut(n,t||(We<n?"forward":"")||(We>n?"backward":"")),r&&r(e)}}({direction:h,index:r+t,onClick:u}):u,E=i(i(i({role:"tabpanel",className:y,style:w,onClick:x},m),p?Le:{}),b?Ce:{});return N.current+=1,i({props:E},v)}))};return e.useEffect((function(){return j.current=0,k===We&&(P.current=!1),W.current="",We!==k?Ne||Xe||I(We):($e&&$e(We,k),(it||"forward"===Qe&&We!==St||"backward"===Qe&&0!==We)&&$t()),function(){clearTimeout(A.current)}}),[k,We,$e,Ne,Xe,$t,it,St,Qe]),e.useEffect((function(){return s&&$t(),function(){clearTimeout(A.current)}}),[s]),e.useEffect((function(){var e=L.current;function t(){clearTimeout(D.current),clearTimeout(A.current),D.current=setTimeout((function(){s!==window.innerWidth&&C(window.innerWidth)}),400)}return s!==window.innerWidth&&C(window.innerWidth),window.addEventListener("resize",t),function(){clearTimeout(D.current),window.removeEventListener("resize",t),document.removeEventListener("mousemove",Kt),document.removeEventListener("mouseup",Qt),document.removeEventListener("touchmove",Kt),document.removeEventListener("touchend",Qt),e.removeEventListener("mouseout",Qt),e.removeEventListener("dragstart",Qt)}}),[Kt,Qt]),N.current=0,R.current=k,n.default.createElement("div",c({onClickCapture:Gt,style:i({display:"flex",flexFlow:"row wrap",boxSizing:"border-box",justifyContent:"center",width:"100%"},q)},$,{ref:O}),se&&!Ct&&n.default.createElement("button",c({},fe,{type:"button",onClick:(0===Ft&&ct||0===We&&at)&&!it?void 0:Jt,disabled:"boolean"==typeof fe.disabled?fe.disabled:!(!(0===Ft&&ct||0===We&&at)||it)}),de),n.default.createElement("div",c({},Q,{style:i(i({},K),{},{display:"flex",boxSizing:"border-box",flexFlow:"row wrap",padding:"0",overflow:"hidden",maxWidth:Mt?"".concat(Mt,"px"):void 0,flex:Mt?void 0:"1 0"}),ref:M}),n.default.createElement("div",c({},ce,{style:i(i({},_),{},{display:"flex",boxSizing:"border-box",outline:"none",transition:kt,transform:zt}),onTouchStart:Tt?void 0:Zt,onMouseDown:Tt?void 0:Yt,onTransitionEnd:Ne||Xe?_t:void 0,tabIndex:-1,role:"presentation",ref:L}),it&&tn(F.slice(k),k,Tt),tn(F,0,Tt),it&&tn(F,0,Tt),it&&tn(F.slice(0,k),0,Tt))),pe&&!Ct&&n.default.createElement("button",c({},ye,{type:"button",onClick:(Ft===jt&&ct||We===St&&at)&&!it?void 0:en,disabled:"boolean"==typeof ye.disabled?ye.disabled:!(!(Ft===jt&&ct||We===St&&at)||it)}),he),!!ht&&n.default.createElement("div",c({style:{width:"100%",display:"flex",justifyContent:"center"}},pt),Array.from({length:Math.ceil(F.length/He)}).map((function(e,t){return n.default.createElement("button",c({type:"button",key:t,title:"".concat(t)},wt,Math.min(t*He,F.length-1)===We?gt:{},{onClick:function(){Ut(Math.min(t*He,F.length-1),Math.min(t*He,F.length-1)>We?"forward":"backward")}}))}))))}return e.memo(C)}));
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "react-simply-carousel",
|
|
3
|
-
"version": "8.2
|
|
3
|
+
"version": "8.3.2",
|
|
4
4
|
"description": "A simple, lightweight, fully controlled isomorphic (with SSR support) React.js carousel component. Touch enabled and responsive. With support for autoplay and infinity options. Fully customizable",
|
|
5
5
|
"files": [
|
|
6
6
|
"dist/"
|