react-simply-carousel 8.4.6 → 8.5.1
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 +41 -32
- package/dist/index.d.ts +18 -9
- package/dist/index.esm.js +1 -1
- package/dist/index.js +1 -1
- package/package.json +2 -2
package/README.md
CHANGED
|
@@ -131,38 +131,47 @@ export default ReactSimplyCarouselExample;
|
|
|
131
131
|
|
|
132
132
|
## Props
|
|
133
133
|
|
|
134
|
-
| Name | Type | Default Value
|
|
135
|
-
| ----------------------------------------------------------------- | ------------------------------------ |
|
|
136
|
-
| **activeSlideIndex** | number |
|
|
137
|
-
| **activeSlideProps** | object | `{}`
|
|
138
|
-
| **autoplay** | boolean | `false`
|
|
139
|
-
| **autoplayDirection** | string (`'forward'` or `'backward'`) | `'forward'`
|
|
140
|
-
| **backwardBtnProps** | object | `{}`
|
|
141
|
-
| **children** | node | `null`
|
|
142
|
-
| **containerProps** | object | `{}`
|
|
143
|
-
| **delay** | number | `0`
|
|
144
|
-
| **disableNavIfAllVisible** | boolean | `true`
|
|
145
|
-
| **easing** | string | `'linear'`
|
|
146
|
-
| **forwardBtnProps** | object | `{}`
|
|
147
|
-
| **hideNavIfAllVisible** | boolean | `true`
|
|
148
|
-
| **innerProps** | object | `{}`
|
|
149
|
-
| **itemsListProps** | object | `{}`
|
|
150
|
-
| **itemsToScroll** | number | `1`
|
|
151
|
-
| **itemsToShow** | number | `0` (automaticaly calculated)
|
|
152
|
-
| **onAfterChange** | function | `null`
|
|
153
|
-
| **onRequestChange** | function |
|
|
154
|
-
| **responsiveProps** | Array of objects | `[]`
|
|
155
|
-
| **speed** | number | `0`
|
|
156
|
-
| **updateOnItemClick** | boolean | `false`
|
|
157
|
-
| **centerMode** (disabled if `infinite` prop disabled) | boolean | `false`
|
|
158
|
-
| **infinite** | boolean | `true`
|
|
159
|
-
| **disableNavIfEdgeVisible** (disabled if `infinite` prop enabled) | boolean | `true`
|
|
160
|
-
| **disableNavIfEdgeActive** | boolean | `true`
|
|
161
|
-
| **dotsNav** (experimental) | object | `{}`
|
|
162
|
-
| **persistentChangeCallbacks** | boolean | `false`
|
|
163
|
-
| **showSlidesBeforeInit** (deprecated) | boolean | `true`
|
|
164
|
-
| **visibleSlideProps** | object | `{}`
|
|
165
|
-
| **autoplayDelay** | number | `0`
|
|
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 |
|
|
165
|
+
| **autoplayDelay** | number | `0` | after what period of time the auto-update function of the active slide will be launched |
|
|
166
|
+
| **preventScrollOnSwipe** | boolean | `false` | prevent vertical scroll on swipe |
|
|
167
|
+
| **disableSwipeByMouse** | boolean | `false` | disable swipe by mouse |
|
|
168
|
+
| **disableSwipeByTouch** | boolean | `false` | disable swipe by touch |
|
|
169
|
+
| **swipeTreshold** | number | half width of the active slide | minimum swipe distance in px (by touch or by mouse drag) for change slide |
|
|
170
|
+
| **touchSwipeTreshold** | number | half width of the active slide | minimum swipe distance in px (by touch) for change slide |
|
|
171
|
+
| **mouseSwipeTreshold** | number | half width of the active slide | minimum swipe distance in px (by mouse drag) for change slide |
|
|
172
|
+
| **swipeRatio** | number | `1` | swipe distance ratio (on swipe by touchmove or by mouse drag) |
|
|
173
|
+
| **touchSwipeTreshold** | number | | swipe distance ratio (on swipe by touchmove) |
|
|
174
|
+
| **mouseSwipeTreshold** | number | | swipe distance ratio (on swipe by mouse drag) |
|
|
166
175
|
|
|
167
176
|
## Demo
|
|
168
177
|
|
package/dist/index.d.ts
CHANGED
|
@@ -20,33 +20,42 @@ type VisibleSlidesState = {
|
|
|
20
20
|
type ReactSimplyCarouselStaticProps = {
|
|
21
21
|
activeSlideIndex: number;
|
|
22
22
|
activeSlideProps?: HTMLAttributes<any>;
|
|
23
|
-
visibleSlideProps?: HTMLAttributes<any>;
|
|
24
23
|
autoplay?: boolean;
|
|
24
|
+
autoplayDelay?: number;
|
|
25
25
|
autoplayDirection?: NavDirection;
|
|
26
26
|
backwardBtnProps?: NavBtnProps;
|
|
27
|
+
centerMode?: boolean;
|
|
27
28
|
children?: ReactNode;
|
|
28
29
|
containerProps?: HTMLAttributes<HTMLDivElement>;
|
|
29
30
|
delay?: number;
|
|
30
31
|
disableNavIfAllVisible?: boolean;
|
|
32
|
+
disableNavIfEdgeActive?: boolean;
|
|
33
|
+
disableNavIfEdgeVisible?: boolean;
|
|
34
|
+
disableSwipeByMouse?: boolean;
|
|
35
|
+
disableSwipeByTouch?: boolean;
|
|
36
|
+
dotsNav?: DotsNav;
|
|
31
37
|
easing?: string;
|
|
32
38
|
forwardBtnProps?: NavBtnProps;
|
|
33
39
|
hideNavIfAllVisible?: boolean;
|
|
40
|
+
infinite?: boolean;
|
|
34
41
|
innerProps?: HTMLAttributes<HTMLDivElement>;
|
|
35
42
|
itemsListProps?: HTMLAttributes<HTMLDivElement>;
|
|
36
43
|
itemsToScroll?: number;
|
|
37
44
|
itemsToShow?: number;
|
|
45
|
+
mouseSwipeRatio?: number;
|
|
46
|
+
mouseSwipeTreshold?: number;
|
|
38
47
|
onAfterChange?: (activeSlideIndex: number, deprecated_positionSlideIndex: number) => void;
|
|
39
48
|
onRequestChange: (newActiveSlideIndex: number, newVisibleSlidesState: VisibleSlidesState) => void;
|
|
40
|
-
speed?: number;
|
|
41
|
-
updateOnItemClick?: boolean;
|
|
42
|
-
centerMode?: boolean;
|
|
43
|
-
infinite?: boolean;
|
|
44
|
-
disableNavIfEdgeVisible?: boolean;
|
|
45
|
-
disableNavIfEdgeActive?: boolean;
|
|
46
|
-
dotsNav?: DotsNav;
|
|
47
49
|
persistentChangeCallbacks?: boolean;
|
|
50
|
+
preventScrollOnSwipe?: boolean;
|
|
48
51
|
showSlidesBeforeInit?: boolean;
|
|
49
|
-
|
|
52
|
+
speed?: number;
|
|
53
|
+
swipeRatio?: number;
|
|
54
|
+
swipeTreshold?: number;
|
|
55
|
+
touchSwipeRatio?: number;
|
|
56
|
+
touchSwipeTreshold?: number;
|
|
57
|
+
updateOnItemClick?: boolean;
|
|
58
|
+
visibleSlideProps?: HTMLAttributes<any>;
|
|
50
59
|
};
|
|
51
60
|
type ReactSimplyCarouselResponsiveProps = (Omit<Omit<ReactSimplyCarouselStaticProps, 'activeSlideIndex'>, 'onRequestChange'> & {
|
|
52
61
|
minWidth?: number;
|
package/dist/index.esm.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import e,{memo as t,useState as n,useRef as r,Children as i,useCallback as o,useEffect as c}from"react";function a(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?a(Object(n),!0).forEach((function(t){d(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):a(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}function d(e,t,n){return(t=function(e){var t=function(e,t){if("object"!=typeof e||null===e)return e;var n=e[Symbol.toPrimitive];if(void 0!==n){var r=n.call(e,t||"default");if("object"!=typeof r)return r;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}(e,"string");return"symbol"==typeof t?t:String(t)}(t))in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function u(){return u=Object.assign?Object.assign.bind():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},u.apply(this,arguments)}function s(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 f(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){var r,i,o,c,a=[],l=!0,d=!1;try{if(o=(n=n.call(e)).next,0===t){if(Object(n)!==n)return;l=!1}else for(;!(l=(r=o.call(n)).done)&&(a.push(r.value),a.length!==t);l=!0);}catch(e){d=!0,i=e}finally{try{if(!l&&null!=n.return&&(c=n.return(),Object(c)!==c))return}finally{if(d)throw i}}return a}}(e,t)||m(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 v(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)||m(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 m(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 C(t){var a,d=t.responsiveProps,m=void 0===d?[]:d,h=s(t,b),C=f(n(0),2),L=C[0],j=C[1],k=f(n(h.activeSlideIndex),2),P=k[0],M=k[1],W=r(null),A=r(null),N=r(null),X=r(0),D=r(!1),F=r(!1),V=r(""),z=r(null),B=r(null),q=r(0),H=r(P),R=m.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=s(t,p);return L>r&&(!o||L<=o)?l(l({},e),c):e}),h),U=i.toArray(R.children),$=L?l(l({},R),{},{activeSlideIndex:Math.max(0,Math.min(R.activeSlideIndex,U.length-1)),itemsToShow:Math.min(U.length,R.itemsToShow||0),itemsToScroll:Math.min(U.length,R.itemsToScroll||1)}):h,G=$.containerProps,J=void 0===G?{}:G,K=J.style,Q=void 0===K?{}:K,Y=J.onClickCapture,Z=void 0===Y?null:Y,_=s(J,y),ee=$.innerProps,te=void 0===ee?{}:ee,ne=te.style,re=void 0===ne?{}:ne,ie=s(te,w),oe=$.itemsListProps,ce=void 0===oe?{}:oe,ae=ce.style,le=void 0===ae?{}:ae,de=ce.onTouchStart,ue=void 0===de?null:de,se=ce.onMouseDown,fe=void 0===se?null:se,ve=ce.onTransitionEnd,me=void 0===ve?null:ve,he=s(ce,x),be=$.backwardBtnProps,pe=void 0===be?{}:be,ye=pe.children,we=void 0===ye?null:ye,xe=pe.show,ge=void 0===xe||xe,Se=s(pe,g),Ee=$.forwardBtnProps,Te=void 0===Ee?{}:Ee,Ie=Te.children,Oe=void 0===Ie?null:Ie,Ce=Te.show,Le=void 0===Ce||Ce,je=s(Te,S),ke=$.activeSlideProps,Pe=void 0===ke?{}:ke,Me=Pe.className,We=void 0===Me?"":Me,Ae=Pe.style,Ne=void 0===Ae?{}:Ae,Xe=s(Pe,E),De=$.visibleSlideProps,Fe=void 0===De?{}:De,Ve=Fe.className,ze=void 0===Ve?"":Ve,Be=Fe.style,qe=void 0===Be?{}:Be,He=s(Fe,T),Re=$.updateOnItemClick,Ue=void 0!==Re&&Re,$e=$.activeSlideIndex,Ge=$.onRequestChange,Je=$.speed,Ke=void 0===Je?0:Je,Qe=$.delay,Ye=void 0===Qe?0:Qe,Ze=$.easing,_e=void 0===Ze?"linear":Ze,et=$.itemsToShow,tt=void 0===et?0:et,nt=$.itemsToScroll,rt=void 0===nt?1:nt,it=$.children,ot=$.onAfterChange,ct=$.autoplay,at=void 0!==ct&&ct,lt=$.autoplayDirection,dt=void 0===lt?"forward":lt,ut=$.disableNavIfAllVisible,st=void 0===ut||ut,ft=$.hideNavIfAllVisible,vt=void 0===ft||ft,mt=$.centerMode,ht=void 0!==mt&&mt,bt=$.infinite,pt=void 0===bt||bt,yt=$.disableNavIfEdgeVisible,wt=void 0===yt||yt,xt=$.disableNavIfEdgeActive,gt=void 0===xt||xt,St=$.dotsNav,Et=void 0===St?{}:St,Tt=$.persistentChangeCallbacks,It=void 0!==Tt&&Tt,Ot=$.autoplayDelay,Ct=void 0===Ot?0:Ot,Lt=Et||{},jt=Lt.show,kt=void 0!==jt&&jt,Pt=Lt.containerProps,Mt=void 0===Pt?{}:Pt,Wt=Lt.itemBtnProps,At=void 0===Wt?{}:Wt,Nt=Lt.activeItemBtnProps,Xt=void 0===Nt?{}:Nt,Dt=i.count(it)-1,Ft=tt===U.length,Vt=vt&&Ft,zt=st&&Ft,Bt=$e-P==0||!Ke&&!Ye?"none":"transform ".concat(Ke,"ms ").concat(_e," ").concat(Ye,"ms"),qt=o((function(e){var t,n=e.correctionSlideIndex,r=e.prevCorrectionSlideIndex,i=e.curActiveSlideIndex,o=N.current.offsetWidth,c=N.current.children,a=c.length,l=pt?v(c).slice(a/3-r,a/3-r+a/3):v(c),d=null===(t=l[i])||void 0===t?void 0:t.offsetWidth,u=tt?l.reduce((function(e,t,n){return n>=i&&n<i+tt||n<i&&n<i+tt-l.length?e+t.offsetWidth:e}),0):A.current.offsetWidth,s=o-u,f=ht&&pt?-(u-d)/2:0,m=pt?o/3:0,h=n-i==0?0:"forward"===V.current&&i<n?m:"backward"===V.current&&i>n?-m:0,b=i-n!=0,p=function(e){var t=l.reduce((function(t,n,r){return r>=e?t:t+(n.offsetWidth||0)}),0);return pt?t:Math.min(s,t)},y=b&&pt?p(n):0,w=b||!pt?p(i):0,x=zt?0:w-y+f+h+m,g="translateX(-".concat(x,"px)"),S=pt?m+f:Math.min(s,l.reduce((function(e,t,n){return n<i?e+t.offsetWidth:e}),0)),E=S+u,T=l.map((function(e,t){return{slideIndex:t,htmlElement:e}})),I=pt?[].concat(v(l.slice(i).map((function(e,t){return{slideIndex:t+i,htmlElement:e}}))),v(T),v(T),v(l.slice(0,i).map((function(e,t){return{slideIndex:t,htmlElement:e}})))):T,O=I.reduce((function(e,t){var n=t.slideIndex,r=t.htmlElement.offsetWidth;return(e.summ>=S&&e.summ<E||e.summ+r>S&&e.summ+r<=E)&&e.items.push({slideIndex:n,isFullyVisible:e.summ+r<=E&&e.summ>=S}),e.summ+=r,e}),{summ:0,items:[]}),C=!!O.items.find((function(e){return 0===e.slideIndex})),L=!!O.items.find((function(e){return e.slideIndex===l.length-1}));return{slidesHTMLElements:l,innerMaxWidth:u,itemsListMaxTranslateX:s,activeSlideWidth:d,offsetCorrectionForCenterMode:f,offsetCorrectionForInfiniteMode:m,itemsListTranslateX:x,itemsListTransform:g,visibleSlides:O.items,isFirstSlideVisible:C,isLastSlideVisible:L}}),[ht,zt,pt,tt]),Ht=L?qt({prevCorrectionSlideIndex:H.current,curActiveSlideIndex:$e,correctionSlideIndex:P}):{},Rt=Ht.innerMaxWidth,Ut=void 0===Rt?0:Rt,$t=Ht.itemsListMaxTranslateX,Gt=void 0===$t?0:$t,Jt=Ht.activeSlideWidth,Kt=void 0===Jt?0:Jt,Qt=Ht.offsetCorrectionForCenterMode,Yt=void 0===Qt?0:Qt,Zt=Ht.offsetCorrectionForInfiniteMode,_t=void 0===Zt?0:Zt,en=Ht.itemsListTranslateX,tn=void 0===en?0:en,nn=Ht.itemsListTransform,rn=void 0===nn?"none":nn,on=Ht.visibleSlides,cn=void 0===on?[]:on,an=o((function(e){if("forward"===e){var t=$e+rt;return t>Dt?pt?t-Dt-1:Dt:t}if("backward"===e){var n=$e-rt;return n<0?pt?Dt+1+n:0:n}return $e}),[$e,rt,Dt,pt]),ln=o((function(e,t){if(V.current=t,N.current.style.transition=Ke||Ye?"transform ".concat(Ke,"ms ").concat(_e," ").concat(Ye,"ms"):"none",e!==$e||It){clearTimeout(z.current);var n=qt({correctionSlideIndex:P,prevCorrectionSlideIndex:P,curActiveSlideIndex:e}),r=n.visibleSlides,i=n.isFirstSlideVisible,o=n.isLastSlideVisible;Ge(e,{visibleSlides:r,isFirstSlideVisible:i,isLastSlideVisible:o})}else X.current=0,N.current.style.transform="translateX(-".concat(Yt+_t+(pt?0:tn),"px)")}),[It,$e,Yt,Ye,_e,Ke,Ge,_t,pt,tn,P,qt]),dn=o((function(){at&&(clearTimeout(z.current),z.current=setTimeout((function(){ln(an(dt),dt)}),Ct||Ye))}),[at,dt,Ct,ln,an,Ye]),un=o((function(e){D.current&&(e.preventDefault(),e.stopPropagation(),Z&&Z(e))}),[Z]),sn=o((function(){ln(an("backward"),"backward")}),[ln,an]),fn=o((function(e){D.current=!0;var t=e.touches&&e.touches[0]?e.touches[0].clientX:e.clientX,n=X.current-t+Yt+_t+(pt?0:tn),r=N.current.offsetWidth-A.current.offsetWidth,i=Math.max(Math.min(0,-n),-r);N.current.style.transition="none",N.current.style.transform="translateX(".concat(i,"px)")}),[Yt,_t,pt,tn]),vn=o((function(e){if(N.current.removeEventListener("mouseout",vn),N.current.removeEventListener("dragstart",vn),document.removeEventListener("mousemove",fn),document.removeEventListener("mouseup",vn),document.removeEventListener("touchmove",fn),document.removeEventListener("touchend",vn),D.current){var t=e.changedTouches&&e.changedTouches.length?e.changedTouches[e.changedTouches.length-1].clientX:e.clientX,n=X.current-t,r=n>Kt/2?{index:an("forward"),direction:"forward"}:n<-Kt/2?{index:an("backward"),direction:"backward"}:{index:$e,direction:"forward"};r.index===$e&&(D.current=!1),ln(r.index,r.direction)}}),[$e,Kt,ln,an,fn]),mn=o((function(e){clearTimeout(z.current),D.current||(X.current=e.clientX,document.addEventListener("mousemove",fn),document.addEventListener("mouseup",vn),N.current.addEventListener("mouseout",vn),N.current.addEventListener("dragstart",vn)),fe&&fe(e)}),[fn,vn,fe]),hn=o((function(e){clearTimeout(z.current),D.current||(X.current=e.touches[0].clientX,document.addEventListener("touchmove",fn),document.addEventListener("touchend",vn)),ue&&ue(e)}),[fn,vn,ue]),bn=o((function(e){M($e),me&&me(e)}),[$e,me]),pn=o((function(){ln(an("forward"),"forward")}),[ln,an]),yn=function(e,t,n){return e.map((function(e,r){var i=e.props,o=void 0===i?{}:i,c=o.className,a=void 0===c?"":c,d=o.onClick,u=void 0===d?null:d,f=o.style,v=void 0===f?{}:f,m=s(o,I),h=s(e,O),b=pt?q.current>=U.length?"forward":"backward":r>=$e?"forward":"backward",p=r+t===$e,y=cn.find((function(e){return e.slideIndex===r+t})),w="".concat(a," ").concat(b," ").concat(p?We:""," ").concat(y?ze:""),x=l(l(l(l({},v),y?qe:{}),p?Ne:{}),{},{boxSizing:"border-box",margin:0}),g=!n&&Ue?function(e){var t=e.direction,n=e.index,r=e.onClick;return function(e){ln(n,t||($e<n?"forward":"")||($e>n?"backward":"")),r&&r(e)}}({direction:b,index:r+t,onClick:u}):u,S=l(l(l({role:"tabpanel",className:w,style:x,onClick:g},m),y?He:{}),p?Xe:{});return q.current+=1,l({props:S},h)}))};return c((function(){return X.current=0,P===$e&&(D.current=!1),V.current="",$e!==P?(!Ke&&!Ye||F.current)&&M($e):(ot&&ot($e,P),(pt||"forward"===dt&&$e!==Dt||"backward"===dt&&0!==$e)&&dn()),function(){clearTimeout(z.current)}}),[P,$e,ot,Ke,Ye,dn,pt,Dt,dt]),c((function(){return L&&dn(),function(){clearTimeout(z.current)}}),[L]),c((function(){var e=N.current;function t(){clearTimeout(B.current),clearTimeout(z.current),B.current=setTimeout((function(){L!==window.innerWidth&&j(window.innerWidth)}),400)}return L!==window.innerWidth&&j(window.innerWidth),window.addEventListener("resize",t),function(){clearTimeout(B.current),window.removeEventListener("resize",t),document.removeEventListener("mousemove",fn),document.removeEventListener("mouseup",vn),document.removeEventListener("touchmove",fn),document.removeEventListener("touchend",vn),e.removeEventListener("mouseout",vn),e.removeEventListener("dragstart",vn)}}),[fn,vn]),q.current=0,H.current=P,F.current=(null===(a=N.current)||void 0===a?void 0:a.style.transform)===rn,e.createElement("div",u({onClickCapture:un,style:l({display:"flex",flexFlow:"row wrap",boxSizing:"border-box",justifyContent:"center",width:"100%"},Q)},_,{ref:W}),ge&&!Vt&&e.createElement("button",u({},Se,{type:"button",onClick:(0===tn&&wt||0===$e&>)&&!pt?void 0:sn,disabled:"boolean"==typeof Se.disabled?Se.disabled:!(!(0===tn&&wt||0===$e&>)||pt)}),we),e.createElement("div",u({},ie,{style:l(l({},re),{},{display:"flex",boxSizing:"border-box",flexFlow:"row wrap",padding:"0",overflow:"hidden",maxWidth:Ut?"".concat(Ut,"px"):void 0,flex:Ut?void 0:"1 0"}),ref:A}),e.createElement("div",u({},he,{style:l(l({},le),{},{display:"flex",boxSizing:"border-box",outline:"none",transition:Bt,transform:rn}),onTouchStart:zt?void 0:hn,onMouseDown:zt?void 0:mn,onTransitionEnd:Ke||Ye?bn:void 0,tabIndex:-1,role:"presentation",ref:N}),pt&&yn(U.slice(P),P,zt),yn(U,0,zt),pt&&yn(U,0,zt),pt&&yn(U.slice(0,P),0,zt))),Le&&!Vt&&e.createElement("button",u({},je,{type:"button",onClick:(tn===Gt&&wt||$e===Dt&>)&&!pt?void 0:pn,disabled:"boolean"==typeof je.disabled?je.disabled:!(!(tn===Gt&&wt||$e===Dt&>)||pt)}),Oe),!!kt&&e.createElement("div",u({style:{width:"100%",display:"flex",justifyContent:"center"}},Mt),Array.from({length:Math.ceil(U.length/rt)}).map((function(t,n){return e.createElement("button",u({type:"button",key:n,title:"".concat(n)},At,$e>=n*rt&&$e<Math.min(rt*(n+1),Dt+1)?Xt:{},{onClick:function(){ln(Math.min(n*rt,U.length-1),Math.min(n*rt,U.length-1)>$e?"forward":"backward")}}))}))))}var L=t(C);export{L as default};
|
|
1
|
+
import e,{memo as t,useState as n,useRef as r,Children as i,useCallback as o,useEffect as l}from"react";function c(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 d(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?c(Object(n),!0).forEach((function(t){a(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):c(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}function a(e,t,n){return(t=function(e){var t=function(e,t){if("object"!=typeof e||null===e)return e;var n=e[Symbol.toPrimitive];if(void 0!==n){var r=n.call(e,t||"default");if("object"!=typeof r)return r;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}(e,"string");return"symbol"==typeof t?t:String(t)}(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?Object.assign.bind():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 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){var r,i,o,l,c=[],d=!0,a=!1;try{if(o=(n=n.call(e)).next,0===t){if(Object(n)!==n)return;d=!1}else for(;!(d=(r=o.call(n)).done)&&(c.push(r.value),c.length!==t);d=!0);}catch(e){a=!0,i=e}finally{try{if(!d&&null!=n.return&&(l=n.return(),Object(l)!==l))return}finally{if(a)throw i}}return c}}(e,t)||m(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)||m(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 m(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 p=["responsiveProps"],b=["minWidth","maxWidth"],y=["style"],w=["style"],x=["style","onTransitionEnd"],S=["children","show"],g=["children","show"],E=["className","style"],T=["className","style"],I=["className","onClick","style"],O=["props"];function L(t){var c=t.responsiveProps,a=void 0===c?[]:c,m=u(t,p),h=v(n(0),2),L=h[0],j=h[1],k=v(n(m.activeSlideIndex),2),P=k[0],C=k[1],M=r(null),W=r(null),A=r(null),N=r(!1),X=r(0),F=r(!1),V=r(""),D=r(null),z=r(null),B=r(0),R=r(P),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,l=u(t,b);return L>r&&(!o||L<=o)?d(d({},e),l):e}),m),H=i.toArray(q.children),U=L?d(d({},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)}):m,$=U.containerProps,G=void 0===$?{}:$,J=G.style,K=void 0===J?{}:J,Q=u(G,y),Y=U.innerProps,Z=void 0===Y?{}:Y,_=Z.style,ee=void 0===_?{}:_,te=u(Z,w),ne=U.itemsListProps,re=void 0===ne?{}:ne,ie=re.style,oe=void 0===ie?{}:ie,le=re.onTransitionEnd,ce=void 0===le?void 0:le,de=u(re,x),ae=U.backwardBtnProps,se=void 0===ae?{}:ae,ue=se.children,ve=void 0===ue?null:ue,fe=se.show,me=void 0===fe||fe,he=u(se,S),pe=U.forwardBtnProps,be=void 0===pe?{}:pe,ye=be.children,we=void 0===ye?null:ye,xe=be.show,Se=void 0===xe||xe,ge=u(be,g),Ee=U.activeSlideProps,Te=void 0===Ee?{}:Ee,Ie=Te.className,Oe=void 0===Ie?"":Ie,Le=Te.style,je=void 0===Le?{}:Le,ke=u(Te,E),Pe=U.visibleSlideProps,Ce=void 0===Pe?{}:Pe,Me=Ce.className,We=void 0===Me?"":Me,Ae=Ce.style,Ne=void 0===Ae?{}:Ae,Xe=u(Ce,T),Fe=U.updateOnItemClick,Ve=void 0!==Fe&&Fe,De=U.activeSlideIndex,ze=U.onRequestChange,Be=U.speed,Re=void 0===Be?0:Be,qe=U.delay,He=void 0===qe?0:qe,Ue=U.easing,$e=void 0===Ue?"linear":Ue,Ge=U.itemsToShow,Je=void 0===Ge?0:Ge,Ke=U.itemsToScroll,Qe=void 0===Ke?1:Ke,Ye=U.children,Ze=U.onAfterChange,_e=U.autoplay,et=void 0!==_e&&_e,tt=U.autoplayDirection,nt=void 0===tt?"forward":tt,rt=U.disableNavIfAllVisible,it=void 0===rt||rt,ot=U.hideNavIfAllVisible,lt=void 0===ot||ot,ct=U.centerMode,dt=void 0!==ct&&ct,at=U.infinite,st=void 0===at||at,ut=U.disableNavIfEdgeVisible,vt=void 0===ut||ut,ft=U.disableNavIfEdgeActive,mt=void 0===ft||ft,ht=U.dotsNav,pt=void 0===ht?{}:ht,bt=U.persistentChangeCallbacks,yt=void 0!==bt&&bt,wt=U.autoplayDelay,xt=void 0===wt?0:wt,St=U.preventScrollOnSwipe,gt=void 0!==St&&St,Et=U.disableSwipeByMouse,Tt=void 0!==Et&&Et,It=U.disableSwipeByTouch,Ot=void 0!==It&&It,Lt=U.touchSwipeTreshold,jt=U.mouseSwipeTreshold,kt=U.swipeTreshold,Pt=U.touchSwipeRatio,Ct=U.mouseSwipeRatio,Mt=U.swipeRatio,Wt=void 0===Mt?1:Mt,At=pt||{},Nt=At.show,Xt=void 0!==Nt&&Nt,Ft=At.containerProps,Vt=void 0===Ft?{}:Ft,Dt=At.itemBtnProps,zt=void 0===Dt?{}:Dt,Bt=At.activeItemBtnProps,Rt=void 0===Bt?{}:Bt,qt=i.count(Ye)-1,Ht=Je===H.length,Ut=lt&&Ht,$t=it&&Ht,Gt=De-P==0||!Re&&!He?"none":"transform ".concat(Re,"ms ").concat($e," ").concat(He,"ms"),Jt=o((function(e){var t,n=e.correctionSlideIndex,r=e.prevCorrectionSlideIndex,i=e.curActiveSlideIndex,o=A.current.offsetWidth,l=A.current.children,c=l.length,d=st?f(l).slice(c/3-r,c/3-r+c/3):f(l),a=null===(t=d[i])||void 0===t?void 0:t.offsetWidth,s=Je?d.reduce((function(e,t,n){return n>=i&&n<i+Je||n<i&&n<i+Je-d.length?e+t.offsetWidth:e}),0):W.current.offsetWidth,u=Math.min(s,W.current.offsetWidth),v=o-u,m=dt&&st?-(u-a)/2:0,h=st?o/3:0,p=n-i==0?0:"forward"===V.current&&i<n?h:"backward"===V.current&&i>n?-h:0,b=i-n!=0,y=function(e){var t=d.reduce((function(t,n,r){return r>=e?t:t+(n.offsetWidth||0)}),0);return st?t:Math.min(v,t)},w=b&&st?y(n):0,x=b||!st?y(i):0,S=$t?0:x-w+m+p+h,g="translateX(-".concat(S,"px)"),E=st?h+m:Math.min(v,d.reduce((function(e,t,n){return n<i?e+t.offsetWidth:e}),0)),T=E+u,I=d.map((function(e,t){return{slideIndex:t,htmlElement:e}})),O=st?[].concat(f(d.slice(i).map((function(e,t){return{slideIndex:t+i,htmlElement:e}}))),f(I),f(I),f(d.slice(0,i).map((function(e,t){return{slideIndex:t,htmlElement:e}})))):I,L=O.reduce((function(e,t){var n=t.slideIndex,r=t.htmlElement.offsetWidth;return(e.summ>=E&&e.summ<T||e.summ+r>E&&e.summ+r<=T)&&e.items.push({slideIndex:n,isFullyVisible:e.summ+r<=T&&e.summ>=E}),e.summ+=r,e}),{summ:0,items:[]}),j=!!L.items.find((function(e){return 0===e.slideIndex})),k=!!L.items.find((function(e){return e.slideIndex===d.length-1}));return{slidesHTMLElements:d,innerMaxWidth:s,itemsListMaxTranslateX:v,activeSlideWidth:a,offsetCorrectionForCenterMode:m,offsetCorrectionForInfiniteMode:h,itemsListTranslateX:S,itemsListTransform:g,visibleSlides:L.items,isFirstSlideVisible:j,isLastSlideVisible:k}}),[dt,$t,st,Je]),Kt=L?Jt({prevCorrectionSlideIndex:R.current,curActiveSlideIndex:De,correctionSlideIndex:P}):{},Qt=Kt.innerMaxWidth,Yt=void 0===Qt?0:Qt,Zt=Kt.itemsListMaxTranslateX,_t=void 0===Zt?0:Zt,en=Kt.activeSlideWidth,tn=void 0===en?0:en,nn=Kt.offsetCorrectionForCenterMode,rn=void 0===nn?0:nn,on=Kt.offsetCorrectionForInfiniteMode,ln=void 0===on?0:on,cn=Kt.itemsListTranslateX,dn=void 0===cn?0:cn,an=Kt.itemsListTransform,sn=void 0===an?"none":an,un=Kt.visibleSlides,vn=void 0===un?[]:un,fn=o((function(e){if("forward"===e){var t=De+Qe;return t>qt?st?t-qt-1:qt:t}if("backward"===e){var n=De-Qe;return n<0?st?qt+1+n:0:n}return De}),[De,Qe,qt,st]),mn=o((function(e,t){if(V.current=t,A.current.style.transition=Re||He?"transform ".concat(Re,"ms ").concat($e," ").concat(He,"ms"):"none",e!==De||yt){var n;clearTimeout(D.current);var r=Jt({correctionSlideIndex:P,prevCorrectionSlideIndex:P,curActiveSlideIndex:e}),i=r.visibleSlides,o=r.isFirstSlideVisible,l=r.isLastSlideVisible,c=r.itemsListTransform;e!==De&&(null===(n=A.current)||void 0===n?void 0:n.style.transform)===c&&(N.current=!0),A.current.style.transform=c,ze(e,{visibleSlides:i,isFirstSlideVisible:o,isLastSlideVisible:l})}else A.current.style.transform="translateX(-".concat(rn+ln+(st?0:dn),"px)")}),[yt,De,rn,He,$e,Re,ze,ln,st,dn,P,Jt]),hn=o((function(){et&&(clearTimeout(D.current),D.current=setTimeout((function(){mn(fn(nt),nt)}),xt||He))}),[et,nt,xt,mn,fn,He]),pn=o((function(){mn(fn("backward"),"backward")}),[mn,fn]),bn=o((function(e){C(De),ce&&ce(e)}),[De,ce]),yn=o((function(){mn(fn("forward"),"forward")}),[mn,fn]),wn=function(e,t,n){return e.map((function(e,r){var i=e.props,o=void 0===i?{}:i,l=o.className,c=void 0===l?"":l,a=o.onClick,s=void 0===a?null:a,v=o.style,f=void 0===v?{}:v,m=u(o,I),h=u(e,O),p=st?B.current>=H.length?"forward":"backward":r>=De?"forward":"backward",b=r+t===De,y=vn.find((function(e){return e.slideIndex===r+t})),w="".concat(c," ").concat(b?Oe:""," ").concat(y?We:"").trim()||void 0,x=d(d(d(d({},f),y?Ne:{}),b?je:{}),{},{boxSizing:"border-box",margin:0}),S=!n&&Ve?function(e){var t=e.direction,n=e.index,r=e.onClick;return function(e){mn(n,t||(De<n?"forward":"")||(De>n?"backward":"")),r&&r(e)}}({direction:p,index:r+t,onClick:s}):s,g=d(d(d({role:"tabpanel",className:w,style:x,onClick:S},m),y?Xe:{}),b?ke:{});return B.current+=1,d({props:g},h)}))};return l((function(){var e=A.current;function t(e){e.preventDefault(),e.stopPropagation()}function n(e){var t,n;F.current=!0;var r=!(null===(t=e.touches)||void 0===t||!t[0]),i=r?null===(n=e.touches)||void 0===n?void 0:n[0].clientX:e.clientX,o=(X.current-i)*((r?Pt:Ct)||Wt)+rn+ln+(st?0:dn),l=A.current.offsetWidth,c=Math.max(-o,-l);A.current.style.transition="none",A.current.style.transform="translateX(".concat(c,"px)")}function r(e){if(document.removeEventListener("mousemove",n),document.removeEventListener("mouseup",r),document.removeEventListener("touchmove",n),document.removeEventListener("touchend",r),F.current){var i,o;null===(i=e.target)||void 0===i||i.addEventListener("click",t);var l=!(null===(o=e.changedTouches)||void 0===o||!o[0]),c=l?e.changedTouches[e.changedTouches.length-1].clientX:e.clientX,d=(X.current-c)*((l?Pt:Ct)||Wt),a=(l?Lt:jt)||kt||tn/2,s=d>a?{index:fn("forward"),direction:"forward"}:d<-a?{index:fn("backward"),direction:"backward"}:{index:De,direction:"forward"};mn(s.index,s.direction)}else{var u;null===(u=e.target)||void 0===u||u.removeEventListener("click",t)}X.current=0,F.current=!1}function i(e){var t,i;clearTimeout(D.current);var o=!(null===(t=e.touches)||void 0===t||!t[0]);X.current=o?null===(i=e.touches)||void 0===i?void 0:i[0].clientX:e.clientX,o?(document.addEventListener("touchmove",n),document.addEventListener("touchend",r)):(document.addEventListener("mousemove",n),document.addEventListener("mouseup",r))}return $t||(Tt||null==e||e.addEventListener("mousedown",i),Ot||null==e||e.addEventListener("touchstart",i,{passive:!0}),Tt&&Ot||null==e||e.addEventListener("dragstart",r)),function(){F.current=!1,X.current=0,null==e||e.removeEventListener("mousedown",i),null==e||e.removeEventListener("touchstart",i),null==e||e.removeEventListener("dragstart",r),document.removeEventListener("mousemove",n),document.removeEventListener("mouseup",r),document.removeEventListener("touchmove",n),document.removeEventListener("touchend",r)}}),[st,dn,sn,rn,ln,De,tn,fn,mn,$t,Tt,Ot,Lt,jt,kt,Pt,Ct,Wt]),l((function(){return De!==P?(!Re&&!He||N.current)&&(N.current=!1,C(De)):(Ze&&Ze(De,P),(st||"forward"===nt&&De!==qt||"backward"===nt&&0!==De)&&hn()),function(){clearTimeout(D.current)}}),[P,De,Ze,Re,He,hn,st,qt,nt]),l((function(){return L&&hn(),function(){clearTimeout(D.current)}}),[L]),l((function(){function e(){clearTimeout(z.current),clearTimeout(D.current),z.current=setTimeout((function(){L!==window.innerWidth&&j(window.innerWidth)}),400)}return L!==window.innerWidth&&j(window.innerWidth),window.addEventListener("resize",e),function(){clearTimeout(z.current),window.removeEventListener("resize",e)}}),[L]),B.current=0,R.current=P,e.createElement("div",s({style:d({display:"flex",flexFlow:"row wrap",boxSizing:"border-box",justifyContent:"center",width:"100%"},K)},Q,{ref:M}),me&&!Ut&&e.createElement("button",s({},he,{type:"button",onClick:(0===dn&&vt||0===De&&mt)&&!st?void 0:pn,disabled:"boolean"==typeof he.disabled?he.disabled:!(!(0===dn&&vt||0===De&&mt)||st)}),ve),e.createElement("div",s({},te,{style:d(d({width:"100%"},ee),{},{display:"flex",boxSizing:"border-box",flexFlow:"row wrap",padding:"0",overflow:"hidden",maxWidth:Yt?"".concat(Yt,"px"):void 0,flex:Yt?void 0:"1 0"}),ref:W}),e.createElement("div",s({},de,{style:d(d({},oe),{},{display:"flex",boxSizing:"border-box",outline:"none",transition:Gt,transform:sn,touchAction:gt?"none":"auto"}),onTransitionEnd:Re||He?bn:ce,tabIndex:-1,role:"presentation",ref:A}),st&&wn(H.slice(P),P,$t),wn(H,0,$t),st&&wn(H,0,$t),st&&wn(H.slice(0,P),0,$t))),Se&&!Ut&&e.createElement("button",s({},ge,{type:"button",onClick:(dn===_t&&vt||De===qt&&mt)&&!st?void 0:yn,disabled:"boolean"==typeof ge.disabled?ge.disabled:!(!(dn===_t&&vt||De===qt&&mt)||st)}),we),!!Xt&&e.createElement("div",s({style:{width:"100%",display:"flex",justifyContent:"center"}},Vt),Array.from({length:Math.ceil(H.length/Qe)}).map((function(t,n){return e.createElement("button",s({type:"button",key:n,title:"".concat(n)},zt,De>=n*Qe&&De<Math.min(Qe*(n+1),qt+1)?Rt:{},{onClick:function(){mn(Math.min(n*Qe,H.length-1),Math.min(n*Qe,H.length-1)>De?"forward":"backward")}}))}))))}var j=t(L);export{j 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,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 n(e){for(var n=1;n<arguments.length;n++){var i=null!=arguments[n]?arguments[n]:{};n%2?t(Object(i),!0).forEach((function(t){r(e,t,i[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(i)):t(Object(i)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(i,t))}))}return e}function r(e,t,n){return(t=function(e){var t=function(e,t){if("object"!=typeof e||null===e)return e;var n=e[Symbol.toPrimitive];if(void 0!==n){var r=n.call(e,t||"default");if("object"!=typeof r)return r;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}(e,"string");return"symbol"==typeof t?t:String(t)}(t))in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function i(){return i=Object.assign?Object.assign.bind():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},i.apply(this,arguments)}function o(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 c(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){var r,i,o,c,l=[],a=!0,u=!1;try{if(o=(n=n.call(e)).next,0===t){if(Object(n)!==n)return;a=!1}else for(;!(a=(r=o.call(n)).done)&&(l.push(r.value),l.length!==t);a=!0);}catch(e){u=!0,i=e}finally{try{if(!a&&null!=n.return&&(c=n.return(),Object(c)!==c))return}finally{if(u)throw i}}return l}}(e,t)||a(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 u(e)}(e)||function(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}(e)||a(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 a(e,t){if(e){if("string"==typeof e)return u(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)?u(e,t):void 0}}function u(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 s=["responsiveProps"],d=["minWidth","maxWidth"],f=["style","onClickCapture"],v=["style"],m=["style","onTouchStart","onMouseDown","onTransitionEnd"],b=["children","show"],h=["children","show"],p=["className","style"],y=["className","style"],w=["className","onClick","style"],g=["props"];function x(t){var r,a=t.responsiveProps,u=void 0===a?[]:a,x=o(t,s),S=c(e.useState(0),2),C=S[0],E=S[1],k=c(e.useState(x.activeSlideIndex),2),T=k[0],I=k[1],O=e.useRef(null),L=e.useRef(null),j=e.useRef(null),P=e.useRef(0),M=e.useRef(!1),W=e.useRef(!1),A=e.useRef(""),R=e.useRef(null),N=e.useRef(null),X=e.useRef(0),D=e.useRef(T),F=u.reduce((function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},r=t.minWidth,i=void 0===r?0:r,c=t.maxWidth,l=void 0===c?null:c,a=o(t,d);return C>i&&(!l||C<=l)?n(n({},e),a):e}),x),V=e.Children.toArray(F.children),z=C?n(n({},F),{},{activeSlideIndex:Math.max(0,Math.min(F.activeSlideIndex,V.length-1)),itemsToShow:Math.min(V.length,F.itemsToShow||0),itemsToScroll:Math.min(V.length,F.itemsToScroll||1)}):x,B=z.containerProps,q=void 0===B?{}:B,H=q.style,U=void 0===H?{}:H,$=q.onClickCapture,G=void 0===$?null:$,J=o(q,f),K=z.innerProps,Q=void 0===K?{}:K,Y=Q.style,Z=void 0===Y?{}:Y,_=o(Q,v),ee=z.itemsListProps,te=void 0===ee?{}:ee,ne=te.style,re=void 0===ne?{}:ne,ie=te.onTouchStart,oe=void 0===ie?null:ie,ce=te.onMouseDown,le=void 0===ce?null:ce,ae=te.onTransitionEnd,ue=void 0===ae?null:ae,se=o(te,m),de=z.backwardBtnProps,fe=void 0===de?{}:de,ve=fe.children,me=void 0===ve?null:ve,be=fe.show,he=void 0===be||be,pe=o(fe,b),ye=z.forwardBtnProps,we=void 0===ye?{}:ye,ge=we.children,xe=void 0===ge?null:ge,Se=we.show,Ce=void 0===Se||Se,Ee=o(we,h),ke=z.activeSlideProps,Te=void 0===ke?{}:ke,Ie=Te.className,Oe=void 0===Ie?"":Ie,Le=Te.style,je=void 0===Le?{}:Le,Pe=o(Te,p),Me=z.visibleSlideProps,We=void 0===Me?{}:Me,Ae=We.className,Re=void 0===Ae?"":Ae,Ne=We.style,Xe=void 0===Ne?{}:Ne,De=o(We,y),Fe=z.updateOnItemClick,Ve=void 0!==Fe&&Fe,ze=z.activeSlideIndex,Be=z.onRequestChange,qe=z.speed,He=void 0===qe?0:qe,Ue=z.delay,$e=void 0===Ue?0:Ue,Ge=z.easing,Je=void 0===Ge?"linear":Ge,Ke=z.itemsToShow,Qe=void 0===Ke?0:Ke,Ye=z.itemsToScroll,Ze=void 0===Ye?1:Ye,_e=z.children,et=z.onAfterChange,tt=z.autoplay,nt=void 0!==tt&&tt,rt=z.autoplayDirection,it=void 0===rt?"forward":rt,ot=z.disableNavIfAllVisible,ct=void 0===ot||ot,lt=z.hideNavIfAllVisible,at=void 0===lt||lt,ut=z.centerMode,st=void 0!==ut&&ut,dt=z.infinite,ft=void 0===dt||dt,vt=z.disableNavIfEdgeVisible,mt=void 0===vt||vt,bt=z.disableNavIfEdgeActive,ht=void 0===bt||bt,pt=z.dotsNav,yt=void 0===pt?{}:pt,wt=z.persistentChangeCallbacks,gt=void 0!==wt&&wt,xt=z.autoplayDelay,St=void 0===xt?0:xt,Ct=yt||{},Et=Ct.show,kt=void 0!==Et&&Et,Tt=Ct.containerProps,It=void 0===Tt?{}:Tt,Ot=Ct.itemBtnProps,Lt=void 0===Ot?{}:Ot,jt=Ct.activeItemBtnProps,Pt=void 0===jt?{}:jt,Mt=e.Children.count(_e)-1,Wt=Qe===V.length,At=at&&Wt,Rt=ct&&Wt,Nt=ze-T==0||!He&&!$e?"none":"transform ".concat(He,"ms ").concat(Je," ").concat($e,"ms"),Xt=e.useCallback((function(e){var t,n=e.correctionSlideIndex,r=e.prevCorrectionSlideIndex,i=e.curActiveSlideIndex,o=j.current.offsetWidth,c=j.current.children,a=c.length,u=ft?l(c).slice(a/3-r,a/3-r+a/3):l(c),s=null===(t=u[i])||void 0===t?void 0:t.offsetWidth,d=Qe?u.reduce((function(e,t,n){return n>=i&&n<i+Qe||n<i&&n<i+Qe-u.length?e+t.offsetWidth:e}),0):L.current.offsetWidth,f=o-d,v=st&&ft?-(d-s)/2:0,m=ft?o/3:0,b=n-i==0?0:"forward"===A.current&&i<n?m:"backward"===A.current&&i>n?-m:0,h=i-n!=0,p=function(e){var t=u.reduce((function(t,n,r){return r>=e?t:t+(n.offsetWidth||0)}),0);return ft?t:Math.min(f,t)},y=h&&ft?p(n):0,w=h||!ft?p(i):0,g=Rt?0:w-y+v+b+m,x="translateX(-".concat(g,"px)"),S=ft?m+v:Math.min(f,u.reduce((function(e,t,n){return n<i?e+t.offsetWidth:e}),0)),C=S+d,E=u.map((function(e,t){return{slideIndex:t,htmlElement:e}})),k=ft?[].concat(l(u.slice(i).map((function(e,t){return{slideIndex:t+i,htmlElement:e}}))),l(E),l(E),l(u.slice(0,i).map((function(e,t){return{slideIndex:t,htmlElement:e}})))):E,T=k.reduce((function(e,t){var n=t.slideIndex,r=t.htmlElement.offsetWidth;return(e.summ>=S&&e.summ<C||e.summ+r>S&&e.summ+r<=C)&&e.items.push({slideIndex:n,isFullyVisible:e.summ+r<=C&&e.summ>=S}),e.summ+=r,e}),{summ:0,items:[]}),I=!!T.items.find((function(e){return 0===e.slideIndex})),O=!!T.items.find((function(e){return e.slideIndex===u.length-1}));return{slidesHTMLElements:u,innerMaxWidth:d,itemsListMaxTranslateX:f,activeSlideWidth:s,offsetCorrectionForCenterMode:v,offsetCorrectionForInfiniteMode:m,itemsListTranslateX:g,itemsListTransform:x,visibleSlides:T.items,isFirstSlideVisible:I,isLastSlideVisible:O}}),[st,Rt,ft,Qe]),Dt=C?Xt({prevCorrectionSlideIndex:D.current,curActiveSlideIndex:ze,correctionSlideIndex:T}):{},Ft=Dt.innerMaxWidth,Vt=void 0===Ft?0:Ft,zt=Dt.itemsListMaxTranslateX,Bt=void 0===zt?0:zt,qt=Dt.activeSlideWidth,Ht=void 0===qt?0:qt,Ut=Dt.offsetCorrectionForCenterMode,$t=void 0===Ut?0:Ut,Gt=Dt.offsetCorrectionForInfiniteMode,Jt=void 0===Gt?0:Gt,Kt=Dt.itemsListTranslateX,Qt=void 0===Kt?0:Kt,Yt=Dt.itemsListTransform,Zt=void 0===Yt?"none":Yt,_t=Dt.visibleSlides,en=void 0===_t?[]:_t,tn=e.useCallback((function(e){if("forward"===e){var t=ze+Ze;return t>Mt?ft?t-Mt-1:Mt:t}if("backward"===e){var n=ze-Ze;return n<0?ft?Mt+1+n:0:n}return ze}),[ze,Ze,Mt,ft]),nn=e.useCallback((function(e,t){if(A.current=t,j.current.style.transition=He||$e?"transform ".concat(He,"ms ").concat(Je," ").concat($e,"ms"):"none",e!==ze||gt){clearTimeout(R.current);var n=Xt({correctionSlideIndex:T,prevCorrectionSlideIndex:T,curActiveSlideIndex:e}),r=n.visibleSlides,i=n.isFirstSlideVisible,o=n.isLastSlideVisible;Be(e,{visibleSlides:r,isFirstSlideVisible:i,isLastSlideVisible:o})}else P.current=0,j.current.style.transform="translateX(-".concat($t+Jt+(ft?0:Qt),"px)")}),[gt,ze,$t,$e,Je,He,Be,Jt,ft,Qt,T,Xt]),rn=e.useCallback((function(){nt&&(clearTimeout(R.current),R.current=setTimeout((function(){nn(tn(it),it)}),St||$e))}),[nt,it,St,nn,tn,$e]),on=e.useCallback((function(e){M.current&&(e.preventDefault(),e.stopPropagation(),G&&G(e))}),[G]),cn=e.useCallback((function(){nn(tn("backward"),"backward")}),[nn,tn]),ln=e.useCallback((function(e){M.current=!0;var t=e.touches&&e.touches[0]?e.touches[0].clientX:e.clientX,n=P.current-t+$t+Jt+(ft?0:Qt),r=j.current.offsetWidth-L.current.offsetWidth,i=Math.max(Math.min(0,-n),-r);j.current.style.transition="none",j.current.style.transform="translateX(".concat(i,"px)")}),[$t,Jt,ft,Qt]),an=e.useCallback((function(e){if(j.current.removeEventListener("mouseout",an),j.current.removeEventListener("dragstart",an),document.removeEventListener("mousemove",ln),document.removeEventListener("mouseup",an),document.removeEventListener("touchmove",ln),document.removeEventListener("touchend",an),M.current){var t=e.changedTouches&&e.changedTouches.length?e.changedTouches[e.changedTouches.length-1].clientX:e.clientX,n=P.current-t,r=n>Ht/2?{index:tn("forward"),direction:"forward"}:n<-Ht/2?{index:tn("backward"),direction:"backward"}:{index:ze,direction:"forward"};r.index===ze&&(M.current=!1),nn(r.index,r.direction)}}),[ze,Ht,nn,tn,ln]),un=e.useCallback((function(e){clearTimeout(R.current),M.current||(P.current=e.clientX,document.addEventListener("mousemove",ln),document.addEventListener("mouseup",an),j.current.addEventListener("mouseout",an),j.current.addEventListener("dragstart",an)),le&&le(e)}),[ln,an,le]),sn=e.useCallback((function(e){clearTimeout(R.current),M.current||(P.current=e.touches[0].clientX,document.addEventListener("touchmove",ln),document.addEventListener("touchend",an)),oe&&oe(e)}),[ln,an,oe]),dn=e.useCallback((function(e){I(ze),ue&&ue(e)}),[ze,ue]),fn=e.useCallback((function(){nn(tn("forward"),"forward")}),[nn,tn]),vn=function(e,t,r){return e.map((function(e,i){var c=e.props,l=void 0===c?{}:c,a=l.className,u=void 0===a?"":a,s=l.onClick,d=void 0===s?null:s,f=l.style,v=void 0===f?{}:f,m=o(l,w),b=o(e,g),h=ft?X.current>=V.length?"forward":"backward":i>=ze?"forward":"backward",p=i+t===ze,y=en.find((function(e){return e.slideIndex===i+t})),x="".concat(u," ").concat(h," ").concat(p?Oe:""," ").concat(y?Re:""),S=n(n(n(n({},v),y?Xe:{}),p?je:{}),{},{boxSizing:"border-box",margin:0}),C=!r&&Ve?function(e){var t=e.direction,n=e.index,r=e.onClick;return function(e){nn(n,t||(ze<n?"forward":"")||(ze>n?"backward":"")),r&&r(e)}}({direction:h,index:i+t,onClick:d}):d,E=n(n(n({role:"tabpanel",className:x,style:S,onClick:C},m),y?De:{}),p?Pe:{});return X.current+=1,n({props:E},b)}))};return e.useEffect((function(){return P.current=0,T===ze&&(M.current=!1),A.current="",ze!==T?(!He&&!$e||W.current)&&I(ze):(et&&et(ze,T),(ft||"forward"===it&&ze!==Mt||"backward"===it&&0!==ze)&&rn()),function(){clearTimeout(R.current)}}),[T,ze,et,He,$e,rn,ft,Mt,it]),e.useEffect((function(){return C&&rn(),function(){clearTimeout(R.current)}}),[C]),e.useEffect((function(){var e=j.current;function t(){clearTimeout(N.current),clearTimeout(R.current),N.current=setTimeout((function(){C!==window.innerWidth&&E(window.innerWidth)}),400)}return C!==window.innerWidth&&E(window.innerWidth),window.addEventListener("resize",t),function(){clearTimeout(N.current),window.removeEventListener("resize",t),document.removeEventListener("mousemove",ln),document.removeEventListener("mouseup",an),document.removeEventListener("touchmove",ln),document.removeEventListener("touchend",an),e.removeEventListener("mouseout",an),e.removeEventListener("dragstart",an)}}),[ln,an]),X.current=0,D.current=T,W.current=(null===(r=j.current)||void 0===r?void 0:r.style.transform)===Zt,e.createElement("div",i({onClickCapture:on,style:n({display:"flex",flexFlow:"row wrap",boxSizing:"border-box",justifyContent:"center",width:"100%"},U)},J,{ref:O}),he&&!At&&e.createElement("button",i({},pe,{type:"button",onClick:(0===Qt&&mt||0===ze&&ht)&&!ft?void 0:cn,disabled:"boolean"==typeof pe.disabled?pe.disabled:!(!(0===Qt&&mt||0===ze&&ht)||ft)}),me),e.createElement("div",i({},_,{style:n(n({},Z),{},{display:"flex",boxSizing:"border-box",flexFlow:"row wrap",padding:"0",overflow:"hidden",maxWidth:Vt?"".concat(Vt,"px"):void 0,flex:Vt?void 0:"1 0"}),ref:L}),e.createElement("div",i({},se,{style:n(n({},re),{},{display:"flex",boxSizing:"border-box",outline:"none",transition:Nt,transform:Zt}),onTouchStart:Rt?void 0:sn,onMouseDown:Rt?void 0:un,onTransitionEnd:He||$e?dn:void 0,tabIndex:-1,role:"presentation",ref:j}),ft&&vn(V.slice(T),T,Rt),vn(V,0,Rt),ft&&vn(V,0,Rt),ft&&vn(V.slice(0,T),0,Rt))),Ce&&!At&&e.createElement("button",i({},Ee,{type:"button",onClick:(Qt===Bt&&mt||ze===Mt&&ht)&&!ft?void 0:fn,disabled:"boolean"==typeof Ee.disabled?Ee.disabled:!(!(Qt===Bt&&mt||ze===Mt&&ht)||ft)}),xe),!!kt&&e.createElement("div",i({style:{width:"100%",display:"flex",justifyContent:"center"}},It),Array.from({length:Math.ceil(V.length/Ze)}).map((function(t,n){return e.createElement("button",i({type:"button",key:n,title:"".concat(n)},Lt,ze>=n*Ze&&ze<Math.min(Ze*(n+1),Mt+1)?Pt:{},{onClick:function(){nn(Math.min(n*Ze,V.length-1),Math.min(n*Ze,V.length-1)>ze?"forward":"backward")}}))}))))}return e.memo(x)}));
|
|
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,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 n(e){for(var n=1;n<arguments.length;n++){var i=null!=arguments[n]?arguments[n]:{};n%2?t(Object(i),!0).forEach((function(t){r(e,t,i[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(i)):t(Object(i)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(i,t))}))}return e}function r(e,t,n){return(t=function(e){var t=function(e,t){if("object"!=typeof e||null===e)return e;var n=e[Symbol.toPrimitive];if(void 0!==n){var r=n.call(e,t||"default");if("object"!=typeof r)return r;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}(e,"string");return"symbol"==typeof t?t:String(t)}(t))in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function i(){return i=Object.assign?Object.assign.bind():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},i.apply(this,arguments)}function o(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 l(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){var r,i,o,l,c=[],a=!0,d=!1;try{if(o=(n=n.call(e)).next,0===t){if(Object(n)!==n)return;a=!1}else for(;!(a=(r=o.call(n)).done)&&(c.push(r.value),c.length!==t);a=!0);}catch(e){d=!0,i=e}finally{try{if(!a&&null!=n.return&&(l=n.return(),Object(l)!==l))return}finally{if(d)throw i}}return c}}(e,t)||a(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 c(e){return function(e){if(Array.isArray(e))return d(e)}(e)||function(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}(e)||a(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 a(e,t){if(e){if("string"==typeof e)return d(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)?d(e,t):void 0}}function d(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 s=["responsiveProps"],u=["minWidth","maxWidth"],f=["style"],v=["style"],m=["style","onTransitionEnd"],h=["children","show"],b=["children","show"],p=["className","style"],y=["className","style"],w=["className","onClick","style"],S=["props"];function g(t){var r=t.responsiveProps,a=void 0===r?[]:r,d=o(t,s),g=l(e.useState(0),2),x=g[0],E=g[1],T=l(e.useState(d.activeSlideIndex),2),I=T[0],O=T[1],C=e.useRef(null),k=e.useRef(null),L=e.useRef(null),j=e.useRef(!1),P=e.useRef(0),M=e.useRef(!1),W=e.useRef(""),A=e.useRef(null),R=e.useRef(null),N=e.useRef(0),X=e.useRef(I),F=a.reduce((function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},r=t.minWidth,i=void 0===r?0:r,l=t.maxWidth,c=void 0===l?null:l,a=o(t,u);return x>i&&(!c||x<=c)?n(n({},e),a):e}),d),V=e.Children.toArray(F.children),D=x?n(n({},F),{},{activeSlideIndex:Math.max(0,Math.min(F.activeSlideIndex,V.length-1)),itemsToShow:Math.min(V.length,F.itemsToShow||0),itemsToScroll:Math.min(V.length,F.itemsToScroll||1)}):d,z=D.containerProps,B=void 0===z?{}:z,q=B.style,H=void 0===q?{}:q,U=o(B,f),$=D.innerProps,G=void 0===$?{}:$,J=G.style,K=void 0===J?{}:J,Q=o(G,v),Y=D.itemsListProps,Z=void 0===Y?{}:Y,_=Z.style,ee=void 0===_?{}:_,te=Z.onTransitionEnd,ne=void 0===te?void 0:te,re=o(Z,m),ie=D.backwardBtnProps,oe=void 0===ie?{}:ie,le=oe.children,ce=void 0===le?null:le,ae=oe.show,de=void 0===ae||ae,se=o(oe,h),ue=D.forwardBtnProps,fe=void 0===ue?{}:ue,ve=fe.children,me=void 0===ve?null:ve,he=fe.show,be=void 0===he||he,pe=o(fe,b),ye=D.activeSlideProps,we=void 0===ye?{}:ye,Se=we.className,ge=void 0===Se?"":Se,xe=we.style,Ee=void 0===xe?{}:xe,Te=o(we,p),Ie=D.visibleSlideProps,Oe=void 0===Ie?{}:Ie,Ce=Oe.className,ke=void 0===Ce?"":Ce,Le=Oe.style,je=void 0===Le?{}:Le,Pe=o(Oe,y),Me=D.updateOnItemClick,We=void 0!==Me&&Me,Ae=D.activeSlideIndex,Re=D.onRequestChange,Ne=D.speed,Xe=void 0===Ne?0:Ne,Fe=D.delay,Ve=void 0===Fe?0:Fe,De=D.easing,ze=void 0===De?"linear":De,Be=D.itemsToShow,qe=void 0===Be?0:Be,He=D.itemsToScroll,Ue=void 0===He?1:He,$e=D.children,Ge=D.onAfterChange,Je=D.autoplay,Ke=void 0!==Je&&Je,Qe=D.autoplayDirection,Ye=void 0===Qe?"forward":Qe,Ze=D.disableNavIfAllVisible,_e=void 0===Ze||Ze,et=D.hideNavIfAllVisible,tt=void 0===et||et,nt=D.centerMode,rt=void 0!==nt&&nt,it=D.infinite,ot=void 0===it||it,lt=D.disableNavIfEdgeVisible,ct=void 0===lt||lt,at=D.disableNavIfEdgeActive,dt=void 0===at||at,st=D.dotsNav,ut=void 0===st?{}:st,ft=D.persistentChangeCallbacks,vt=void 0!==ft&&ft,mt=D.autoplayDelay,ht=void 0===mt?0:mt,bt=D.preventScrollOnSwipe,pt=void 0!==bt&&bt,yt=D.disableSwipeByMouse,wt=void 0!==yt&&yt,St=D.disableSwipeByTouch,gt=void 0!==St&&St,xt=D.touchSwipeTreshold,Et=D.mouseSwipeTreshold,Tt=D.swipeTreshold,It=D.touchSwipeRatio,Ot=D.mouseSwipeRatio,Ct=D.swipeRatio,kt=void 0===Ct?1:Ct,Lt=ut||{},jt=Lt.show,Pt=void 0!==jt&&jt,Mt=Lt.containerProps,Wt=void 0===Mt?{}:Mt,At=Lt.itemBtnProps,Rt=void 0===At?{}:At,Nt=Lt.activeItemBtnProps,Xt=void 0===Nt?{}:Nt,Ft=e.Children.count($e)-1,Vt=qe===V.length,Dt=tt&&Vt,zt=_e&&Vt,Bt=Ae-I==0||!Xe&&!Ve?"none":"transform ".concat(Xe,"ms ").concat(ze," ").concat(Ve,"ms"),qt=e.useCallback((function(e){var t,n=e.correctionSlideIndex,r=e.prevCorrectionSlideIndex,i=e.curActiveSlideIndex,o=L.current.offsetWidth,l=L.current.children,a=l.length,d=ot?c(l).slice(a/3-r,a/3-r+a/3):c(l),s=null===(t=d[i])||void 0===t?void 0:t.offsetWidth,u=qe?d.reduce((function(e,t,n){return n>=i&&n<i+qe||n<i&&n<i+qe-d.length?e+t.offsetWidth:e}),0):k.current.offsetWidth,f=Math.min(u,k.current.offsetWidth),v=o-f,m=rt&&ot?-(f-s)/2:0,h=ot?o/3:0,b=n-i==0?0:"forward"===W.current&&i<n?h:"backward"===W.current&&i>n?-h:0,p=i-n!=0,y=function(e){var t=d.reduce((function(t,n,r){return r>=e?t:t+(n.offsetWidth||0)}),0);return ot?t:Math.min(v,t)},w=p&&ot?y(n):0,S=p||!ot?y(i):0,g=zt?0:S-w+m+b+h,x="translateX(-".concat(g,"px)"),E=ot?h+m:Math.min(v,d.reduce((function(e,t,n){return n<i?e+t.offsetWidth:e}),0)),T=E+f,I=d.map((function(e,t){return{slideIndex:t,htmlElement:e}})),O=ot?[].concat(c(d.slice(i).map((function(e,t){return{slideIndex:t+i,htmlElement:e}}))),c(I),c(I),c(d.slice(0,i).map((function(e,t){return{slideIndex:t,htmlElement:e}})))):I,C=O.reduce((function(e,t){var n=t.slideIndex,r=t.htmlElement.offsetWidth;return(e.summ>=E&&e.summ<T||e.summ+r>E&&e.summ+r<=T)&&e.items.push({slideIndex:n,isFullyVisible:e.summ+r<=T&&e.summ>=E}),e.summ+=r,e}),{summ:0,items:[]}),j=!!C.items.find((function(e){return 0===e.slideIndex})),P=!!C.items.find((function(e){return e.slideIndex===d.length-1}));return{slidesHTMLElements:d,innerMaxWidth:u,itemsListMaxTranslateX:v,activeSlideWidth:s,offsetCorrectionForCenterMode:m,offsetCorrectionForInfiniteMode:h,itemsListTranslateX:g,itemsListTransform:x,visibleSlides:C.items,isFirstSlideVisible:j,isLastSlideVisible:P}}),[rt,zt,ot,qe]),Ht=x?qt({prevCorrectionSlideIndex:X.current,curActiveSlideIndex:Ae,correctionSlideIndex:I}):{},Ut=Ht.innerMaxWidth,$t=void 0===Ut?0:Ut,Gt=Ht.itemsListMaxTranslateX,Jt=void 0===Gt?0:Gt,Kt=Ht.activeSlideWidth,Qt=void 0===Kt?0:Kt,Yt=Ht.offsetCorrectionForCenterMode,Zt=void 0===Yt?0:Yt,_t=Ht.offsetCorrectionForInfiniteMode,en=void 0===_t?0:_t,tn=Ht.itemsListTranslateX,nn=void 0===tn?0:tn,rn=Ht.itemsListTransform,on=void 0===rn?"none":rn,ln=Ht.visibleSlides,cn=void 0===ln?[]:ln,an=e.useCallback((function(e){if("forward"===e){var t=Ae+Ue;return t>Ft?ot?t-Ft-1:Ft:t}if("backward"===e){var n=Ae-Ue;return n<0?ot?Ft+1+n:0:n}return Ae}),[Ae,Ue,Ft,ot]),dn=e.useCallback((function(e,t){if(W.current=t,L.current.style.transition=Xe||Ve?"transform ".concat(Xe,"ms ").concat(ze," ").concat(Ve,"ms"):"none",e!==Ae||vt){var n;clearTimeout(A.current);var r=qt({correctionSlideIndex:I,prevCorrectionSlideIndex:I,curActiveSlideIndex:e}),i=r.visibleSlides,o=r.isFirstSlideVisible,l=r.isLastSlideVisible,c=r.itemsListTransform;e!==Ae&&(null===(n=L.current)||void 0===n?void 0:n.style.transform)===c&&(j.current=!0),L.current.style.transform=c,Re(e,{visibleSlides:i,isFirstSlideVisible:o,isLastSlideVisible:l})}else L.current.style.transform="translateX(-".concat(Zt+en+(ot?0:nn),"px)")}),[vt,Ae,Zt,Ve,ze,Xe,Re,en,ot,nn,I,qt]),sn=e.useCallback((function(){Ke&&(clearTimeout(A.current),A.current=setTimeout((function(){dn(an(Ye),Ye)}),ht||Ve))}),[Ke,Ye,ht,dn,an,Ve]),un=e.useCallback((function(){dn(an("backward"),"backward")}),[dn,an]),fn=e.useCallback((function(e){O(Ae),ne&&ne(e)}),[Ae,ne]),vn=e.useCallback((function(){dn(an("forward"),"forward")}),[dn,an]),mn=function(e,t,r){return e.map((function(e,i){var l=e.props,c=void 0===l?{}:l,a=c.className,d=void 0===a?"":a,s=c.onClick,u=void 0===s?null:s,f=c.style,v=void 0===f?{}:f,m=o(c,w),h=o(e,S),b=ot?N.current>=V.length?"forward":"backward":i>=Ae?"forward":"backward",p=i+t===Ae,y=cn.find((function(e){return e.slideIndex===i+t})),g="".concat(d," ").concat(p?ge:""," ").concat(y?ke:"").trim()||void 0,x=n(n(n(n({},v),y?je:{}),p?Ee:{}),{},{boxSizing:"border-box",margin:0}),E=!r&&We?function(e){var t=e.direction,n=e.index,r=e.onClick;return function(e){dn(n,t||(Ae<n?"forward":"")||(Ae>n?"backward":"")),r&&r(e)}}({direction:b,index:i+t,onClick:u}):u,T=n(n(n({role:"tabpanel",className:g,style:x,onClick:E},m),y?Pe:{}),p?Te:{});return N.current+=1,n({props:T},h)}))};return e.useEffect((function(){var e=L.current;function t(e){e.preventDefault(),e.stopPropagation()}function n(e){var t,n;M.current=!0;var r=!(null===(t=e.touches)||void 0===t||!t[0]),i=r?null===(n=e.touches)||void 0===n?void 0:n[0].clientX:e.clientX,o=(P.current-i)*((r?It:Ot)||kt)+Zt+en+(ot?0:nn),l=L.current.offsetWidth,c=Math.max(-o,-l);L.current.style.transition="none",L.current.style.transform="translateX(".concat(c,"px)")}function r(e){if(document.removeEventListener("mousemove",n),document.removeEventListener("mouseup",r),document.removeEventListener("touchmove",n),document.removeEventListener("touchend",r),M.current){var i,o;null===(i=e.target)||void 0===i||i.addEventListener("click",t);var l=!(null===(o=e.changedTouches)||void 0===o||!o[0]),c=l?e.changedTouches[e.changedTouches.length-1].clientX:e.clientX,a=(P.current-c)*((l?It:Ot)||kt),d=(l?xt:Et)||Tt||Qt/2,s=a>d?{index:an("forward"),direction:"forward"}:a<-d?{index:an("backward"),direction:"backward"}:{index:Ae,direction:"forward"};dn(s.index,s.direction)}else{var u;null===(u=e.target)||void 0===u||u.removeEventListener("click",t)}P.current=0,M.current=!1}function i(e){var t,i;clearTimeout(A.current);var o=!(null===(t=e.touches)||void 0===t||!t[0]);P.current=o?null===(i=e.touches)||void 0===i?void 0:i[0].clientX:e.clientX,o?(document.addEventListener("touchmove",n),document.addEventListener("touchend",r)):(document.addEventListener("mousemove",n),document.addEventListener("mouseup",r))}return zt||(wt||null==e||e.addEventListener("mousedown",i),gt||null==e||e.addEventListener("touchstart",i,{passive:!0}),wt&>||null==e||e.addEventListener("dragstart",r)),function(){M.current=!1,P.current=0,null==e||e.removeEventListener("mousedown",i),null==e||e.removeEventListener("touchstart",i),null==e||e.removeEventListener("dragstart",r),document.removeEventListener("mousemove",n),document.removeEventListener("mouseup",r),document.removeEventListener("touchmove",n),document.removeEventListener("touchend",r)}}),[ot,nn,on,Zt,en,Ae,Qt,an,dn,zt,wt,gt,xt,Et,Tt,It,Ot,kt]),e.useEffect((function(){return Ae!==I?(!Xe&&!Ve||j.current)&&(j.current=!1,O(Ae)):(Ge&&Ge(Ae,I),(ot||"forward"===Ye&&Ae!==Ft||"backward"===Ye&&0!==Ae)&&sn()),function(){clearTimeout(A.current)}}),[I,Ae,Ge,Xe,Ve,sn,ot,Ft,Ye]),e.useEffect((function(){return x&&sn(),function(){clearTimeout(A.current)}}),[x]),e.useEffect((function(){function e(){clearTimeout(R.current),clearTimeout(A.current),R.current=setTimeout((function(){x!==window.innerWidth&&E(window.innerWidth)}),400)}return x!==window.innerWidth&&E(window.innerWidth),window.addEventListener("resize",e),function(){clearTimeout(R.current),window.removeEventListener("resize",e)}}),[x]),N.current=0,X.current=I,e.createElement("div",i({style:n({display:"flex",flexFlow:"row wrap",boxSizing:"border-box",justifyContent:"center",width:"100%"},H)},U,{ref:C}),de&&!Dt&&e.createElement("button",i({},se,{type:"button",onClick:(0===nn&&ct||0===Ae&&dt)&&!ot?void 0:un,disabled:"boolean"==typeof se.disabled?se.disabled:!(!(0===nn&&ct||0===Ae&&dt)||ot)}),ce),e.createElement("div",i({},Q,{style:n(n({width:"100%"},K),{},{display:"flex",boxSizing:"border-box",flexFlow:"row wrap",padding:"0",overflow:"hidden",maxWidth:$t?"".concat($t,"px"):void 0,flex:$t?void 0:"1 0"}),ref:k}),e.createElement("div",i({},re,{style:n(n({},ee),{},{display:"flex",boxSizing:"border-box",outline:"none",transition:Bt,transform:on,touchAction:pt?"none":"auto"}),onTransitionEnd:Xe||Ve?fn:ne,tabIndex:-1,role:"presentation",ref:L}),ot&&mn(V.slice(I),I,zt),mn(V,0,zt),ot&&mn(V,0,zt),ot&&mn(V.slice(0,I),0,zt))),be&&!Dt&&e.createElement("button",i({},pe,{type:"button",onClick:(nn===Jt&&ct||Ae===Ft&&dt)&&!ot?void 0:vn,disabled:"boolean"==typeof pe.disabled?pe.disabled:!(!(nn===Jt&&ct||Ae===Ft&&dt)||ot)}),me),!!Pt&&e.createElement("div",i({style:{width:"100%",display:"flex",justifyContent:"center"}},Wt),Array.from({length:Math.ceil(V.length/Ue)}).map((function(t,n){return e.createElement("button",i({type:"button",key:n,title:"".concat(n)},Rt,Ae>=n*Ue&&Ae<Math.min(Ue*(n+1),Ft+1)?Xt:{},{onClick:function(){dn(Math.min(n*Ue,V.length-1),Math.min(n*Ue,V.length-1)>Ae?"forward":"backward")}}))}))))}return e.memo(g)}));
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "react-simply-carousel",
|
|
3
|
-
"version": "8.
|
|
3
|
+
"version": "8.5.1",
|
|
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/"
|
|
@@ -64,7 +64,7 @@
|
|
|
64
64
|
"eslint-plugin-react-hooks": "^4.6.0",
|
|
65
65
|
"husky": ">=6",
|
|
66
66
|
"lint-staged": ">=13.1.0",
|
|
67
|
-
"prettier": "2.8.
|
|
67
|
+
"prettier": "2.8.4",
|
|
68
68
|
"react": "^18.2.0",
|
|
69
69
|
"react-dom": "^18.2.0",
|
|
70
70
|
"rollup": "^3.13.0",
|