@trendyol-js/react-carousel - npm Package Compare versions

Comparing version 1.0.6 to 1.0.7-beta.1

dist/cjs/index.js

@@ -1,1 +0,1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,t=require("react"),n=(e=t)&&"object"==typeof e&&"default"in e?e.default:e,r=function(){return(r=Object.assign||function(e){for(var t,n=1,r=arguments.length;n<r;n++)for(var i in t=arguments[n])Object.prototype.hasOwnProperty.call(t,i)&&(e[i]=t[i]);return e}).apply(this,arguments)};function i(e,t){void 0===t&&(t={});var n=t.insertAt;if(e&&"undefined"!=typeof document){var r=document.head||document.getElementsByTagName("head")[0],i=document.createElement("style");i.type="text/css","top"===n&&r.firstChild?r.insertBefore(i,r.firstChild):r.appendChild(i),i.styleSheet?i.styleSheet.cssText=e:i.appendChild(document.createTextNode(e))}}var s="styles-module_carousel-base__3keqD",o="styles-module_item-provider__YgMwz",a="styles-module_item-container__a8zaY",l="styles-module_item-tracker__3bypy",u="styles-module_carousel-arrow__26sRw";i(".styles-module_carousel-base__3keqD {\n\twidth: 100%;\n\tbox-sizing: border-box;\n\tdisplay: flex;\n\toutline: none;\n}\n\n.styles-module_item-provider__YgMwz {\n\toverflow: hidden;\n\twidth: 100%;\n\tcursor: pointer;\n}\n\n.styles-module_item-container__a8zaY img {\n\t-webkit-user-select: none;\n\t        user-select: none;\n\t-webkit-user-drag: none;\n}\n\n.styles-module_item-tracker__3bypy {\n\theight: 100%;\n\tdisplay: flex;\n}\n\n.styles-module_carousel-arrow__26sRw {\n\tz-index: 1;\n}\n");var c,f=function(e){return n.createElement("button",{className:u,onClick:e.onClick,"data-direction":e.direction})};!function(e){e[e.Right=-1]="Right",e[e.Left=1]="Left"}(c||(c={}));var d=function(){function e(e,t){this.arr=e,this.currentIndex=t}return e.prototype.next=function(){var e=this.currentIndex,t=this.arr;return this.currentIndex=e<t.length-1?e+1:0,this.current()},e.prototype.prev=function(){var e=this.currentIndex,t=this.arr;return this.currentIndex=e>0?e-1:t.length-1,this.current()},e.prototype.current=function(){return this.arr[this.currentIndex]},e}(),h=function(e,t,n){return n*e*t},m=function(e,t,n,r){var i=e>t;return n?{left:i,right:i}:{left:i&&0!==r,right:i&&r+t<e}};function v(e){return e.nativeEvent instanceof MouseEvent?e.nativeEvent.pageX:e.nativeEvent instanceof TouchEvent?e.nativeEvent.changedTouches[0].pageX:0}var p=function(e){var i=t.useState(200),s=i[0],u=i[1],f=t.useCallback((function(t){if(null!==t){var n=t.getBoundingClientRect().width/e.show;u(n),e.widthCallBack(n)}}),[s]);e.responsive&&function(e){var n=t.useState(window.innerWidth),r=n[0],i=n[1];t.useLayoutEffect((function(){var t=function(){var t=r-window.innerWidth;i(window.innerWidth),e(t)};return window.addEventListener("resize",t),function(){return window.removeEventListener("resize",t)}}),[])}((function(e){u(s-e)}));var d=t.useState({initial:e.transform,start:0,isDown:!1,drag:0,finished:!0,pointers:!0}),h=d[0],m=d[1],p=function(t){t.persist(),m(r(r({},h),{isDown:!0,start:v(t),initial:e.transform,finished:!1}))},g=function(t){if(t.persist(),!h.finished){if(Math.abs(h.drag)<s*e.swipeOn)return e.dragCallback(e.transform),m({initial:e.transform,start:0,isDown:!1,drag:0,finished:!0,pointers:!0});e.slideCallback(h.drag>0?c.Right:c.Left),m(r(r({},h),{drag:0,isDown:!1,finished:!0,pointers:!0}))}},y=function(e){if(e.persist(),h.isDown){var t=v(e);m(r(r({},h),{drag:h.start-t,pointers:!1}))}},w=e.swiping?{onTouchCancel:g,onTouchEnd:g,onTouchMove:y,onTouchStart:p,onMouseDown:p,onMouseLeave:g,onMouseUp:g,onMouseMove:y}:{};return n.createElement("div",{ref:f,className:o},n.createElement("div",r({"":"trackList"},w,{className:l,style:{transform:"translateX("+(e.transform-h.drag)+"px)",transition:"transform "+e.transition+"s ease 0s",width:s*e.items.length}}),e.items.map((function(e,t){return n.createElement("div",{key:t,style:{width:s,pointerEvents:h.pointers?"all":"none"},className:a},e)}))))},g={children:[],show:1,slide:1,transition:.5,swiping:!1,swipeOn:1,responsive:!1,infinite:!0,className:"",useArrowKeys:!1,a11y:{},dynamic:!1},y="styles-module_sliderBase__swkx1",w="styles-module_slider__o0fqa",_="styles-module_sliding__3T6T6";i(".styles-module_sliderBase__swkx1 {\n\twidth: 100%;\n\tposition: relative;\n}\n\n.styles-module_slider__o0fqa {\n\tdisplay: flex;\n\toverflow-x: auto;\n\tscrollbar-width: none; /* Firefox 64 */\n\t-ms-overflow-style: none; /* Internet Explorer 11 */\n}\n\n.styles-module_slider__o0fqa::-webkit-scrollbar {\n\t/** WebKit */\n\tdisplay: none;\n}\n\n.styles-module_slider__o0fqa > * {\n\tflex: 0 0 auto;\n}\n\n.styles-module_sliding__3T6T6 > * {\n\tpointer-events: none;\n}\n");exports.Carousel=function(e){var i=r(r({},g),e),o=t.useState(function(e,t,n){if(!n)return e;for(var r=Array.from(e),i=new d(e,0),s=0;s<t;s++)r.unshift(i.prev());return r}(i.children,i.slide,i.infinite)),a=o[0],l=o[1],u=t.useState(0),v=u[0],y=u[1],w=t.useState({transform:0,transition:0,isSliding:!1}),_=w[0],L=w[1],b=t.useState(0),k=b[0],E=b[1],x=t.useState(m(i.children.length,i.show,i.infinite,k)),C=x[0],S=x[1];i.dynamic&&n.useEffect((function(){var t=function(e,t){return e.map((function(e){return t.find((function(t){return e.key===t.key}))}))}(a,e.children);l(t)}),e.children);var M=function(e,t){if(!(_.isSliding||e===c.Right&&!C.right||e===c.Left&&!C.left)){var n=function(e,t,n,r){var i=e-r*t;return i<0?n+i:n<=i?i-n:i}(k,t,i.children.length,e),r=i.infinite?function(e,t,n,r,i,s){var o=new d(e,n),a=Array.from(t);switch(+s){case c.Left:for(var l=i;l>=0;l--)(i-l<0||!a[l-i])&&a.unshift(o.current()),o.prev();break;case c.Right:for(l=0;l<r+i;l++)a[2*i+l]||a.push(o.current()),o.next()}return a}(i.children,a,n,i.show,t,e):a;i.infinite&&e===c.Right&&l(r),L({transform:_.transform+h(v,t,e),transition:i.transition,isSliding:!0}),E(n),S(m(i.children.length,i.show,i.infinite,n)),setTimeout((function(){i.infinite&&l(function(e,t,n){return n===c.Left?e.slice(0,-1*t):e.slice(t)}(r,t,e)),L({transform:i.infinite?h(v,t,c.Right):_.transform+h(v,t,e),transition:0,isSliding:!1})}),1e3*i.transition)}};return n.createElement("div",r({},i.a11y,{"":"carousel",tabIndex:0},i.useArrowKeys?{onKeyDown:function(e){37===e.keyCode?M(c.Left,i.slide):39===e.keyCode&&M(c.Right,i.slide)}}:{},{className:s+" "+i.className}),C.left&&n.createElement(f,{direction:"left",onClick:function(){return M(c.Left,i.slide)}}),n.createElement(p,r({},i,{transition:_.transition,items:a,transform:_.transform,slideCallback:function(e){M(e,i.slide)},dragCallback:function(e){L({transform:e,transition:i.transition,isSliding:!1}),setTimeout((function(){return L(r(r({},_),{transition:0}))}),1e3*i.transition)},widthCallBack:function(e){y(e),L({transform:i.infinite?h(e,i.slide,c.Right):0,transition:0,isSliding:!1})}})),C.right&&n.createElement(f,{direction:"right",onClick:function(){return M(c.Right,i.slide)}}))},exports.ScrollingCarousel=function(e){var r=e.children,i=e.className,s=t.useRef(null),o=t.useState(!1),a=o[0],l=o[1],u=t.useState({startX:0,scrollLeft:0}),f=u[0],d=u[1],h=function(){var e=s.current;return{left:!!e&&e.scrollLeft>0,right:!!e&&e.scrollWidth>e.scrollLeft+e.offsetWidth}},m=t.useState(h()),v=m[0],p=m[1],g=function(e){p(h())},L=t.useCallback((function(e){null!==e&&(Object.defineProperty(s,"current",{value:e}),p(h()),e.addEventListener("scroll",g))}),[s,r]),b=function(e){l(!1),p(h()),s.current.classList.remove(_)},k=function(e){var t=function(e){for(var t,n,r=s.current,i=e===c.Left?r.scrollLeft+r.offsetWidth:r.scrollLeft,o=0,a=0,l=Array.from(r.children);a<l.length;a++){var u=l[a],f=(t=u,n=void 0,n=getComputedStyle(t),t.offsetWidth+(parseInt(n.marginLeft,10)||0)+(parseInt(n.marginRight,10)||0));if((o+=f)>=i){var d=e===c.Left?o-i:f;return(r.offsetWidth-d)*e}}return r.offsetWidth}(e),n=s.current.scrollLeft;E(500,t,n)},E=function(e,t,n){for(var r=0,i=0;r<=e;i++)window.setTimeout(x,r,i*t/100+n),r+=e/100},x=function(e){s.current.scrollLeft=e};return n.createElement("div",{className:y+" "+i},v.left&&n.createElement("div",{"data-arrow":"left"},n.createElement("button",{onClick:function(){return k(c.Right)}})),v.right&&n.createElement("div",{"data-arrow":"right"},n.createElement("button",{onClick:function(){return k(c.Left)}})),n.createElement("div",{ref:L,onMouseDown:function(e){l(!0),d({startX:e.pageX-s.current.offsetLeft,scrollLeft:s.current.scrollLeft})},onMouseLeave:b,onMouseUp:b,onMouseMove:function(e){if(a){e.preventDefault(),s.current.classList.add(_);var t=e.pageX-s.current.offsetLeft-f.startX;s.current.scrollLeft=f.scrollLeft-t}},className:w},r))};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,t=require("react"),n=(e=t)&&"object"==typeof e&&"default"in e?e.default:e,r=function(){return(r=Object.assign||function(e){for(var t,n=1,r=arguments.length;n<r;n++)for(var i in t=arguments[n])Object.prototype.hasOwnProperty.call(t,i)&&(e[i]=t[i]);return e}).apply(this,arguments)};function i(e,t){void 0===t&&(t={});var n=t.insertAt;if(e&&"undefined"!=typeof document){var r=document.head||document.getElementsByTagName("head")[0],i=document.createElement("style");i.type="text/css","top"===n&&r.firstChild?r.insertBefore(i,r.firstChild):r.appendChild(i),i.styleSheet?i.styleSheet.cssText=e:i.appendChild(document.createTextNode(e))}}var s="styles-module_carousel-base__3keqD",o="styles-module_item-provider__YgMwz",a="styles-module_item-container__a8zaY",l="styles-module_item-tracker__3bypy",u="styles-module_carousel-arrow__26sRw";i(".styles-module_carousel-base__3keqD {\n\twidth: 100%;\n\tbox-sizing: border-box;\n\tdisplay: flex;\n\toutline: none;\n}\n\n.styles-module_item-provider__YgMwz {\n\toverflow: hidden;\n\twidth: 100%;\n\tcursor: pointer;\n}\n\n.styles-module_item-container__a8zaY img {\n\t-webkit-user-select: none;\n\t        user-select: none;\n\t-webkit-user-drag: none;\n}\n\n.styles-module_item-tracker__3bypy {\n\theight: 100%;\n\tdisplay: flex;\n}\n\n.styles-module_carousel-arrow__26sRw {\n\tz-index: 1;\n}\n");var c,f=function(e){return n.createElement("button",{className:u,onClick:e.onClick,"data-direction":e.direction})};!function(e){e[e.Right=-1]="Right",e[e.Left=1]="Left"}(c||(c={}));var d=function(){function e(e,t){this.arr=e,this.currentIndex=t}return e.prototype.next=function(){var e=this.currentIndex,t=this.arr;return this.currentIndex=e<t.length-1?e+1:0,this.current()},e.prototype.prev=function(){var e=this.currentIndex,t=this.arr;return this.currentIndex=e>0?e-1:t.length-1,this.current()},e.prototype.current=function(){return this.arr[this.currentIndex]},e}(),h=function(e,t,n){return n*e*t},m=function(e,t,n,r){var i=e>t;return n?{left:i,right:i}:{left:i&&0!==r,right:i&&r+t<e}},v=function(e,t,n){if(!n)return e;for(var r=Array.from(e),i=new d(e,0),s=0;s<t;s++)r.unshift(i.prev());return r};function p(e){return e.nativeEvent instanceof MouseEvent?e.nativeEvent.pageX:e.nativeEvent instanceof TouchEvent?e.nativeEvent.changedTouches[0].pageX:0}function g(e,t,n,r){var i=e.map((function(e){return t.find((function(t){return e.key===t.key}))}));return i.some((function(e){return void 0===e}))?v(t,n,r):i}var y=function(e){var i=t.useState(200),s=i[0],u=i[1],f=t.useCallback((function(t){if(null!==t){var n=t.getBoundingClientRect().width/e.show;u(n),e.widthCallBack(n)}}),[s]);e.responsive&&function(e){var n=t.useState(window.innerWidth),r=n[0],i=n[1];t.useLayoutEffect((function(){var t=function(){var t=r-window.innerWidth;i(window.innerWidth),e(t)};return window.addEventListener("resize",t),function(){return window.removeEventListener("resize",t)}}),[])}((function(e){u(s-e)}));var d=t.useState({initial:e.transform,start:0,isDown:!1,drag:0,finished:!0,pointers:!0}),h=d[0],m=d[1],v=function(t){t.persist(),m(r(r({},h),{isDown:!0,start:p(t),initial:e.transform,finished:!1}))},g=function(t){if(t.persist(),!h.finished){if(Math.abs(h.drag)<s*e.swipeOn)return e.dragCallback(e.transform),m({initial:e.transform,start:0,isDown:!1,drag:0,finished:!0,pointers:!0});e.slideCallback(h.drag>0?c.Right:c.Left),m(r(r({},h),{drag:0,isDown:!1,finished:!0,pointers:!0}))}},y=function(e){if(e.persist(),h.isDown){var t=p(e);m(r(r({},h),{drag:h.start-t,pointers:!1}))}},w=e.swiping?{onTouchCancel:g,onTouchEnd:g,onTouchMove:y,onTouchStart:v,onMouseDown:v,onMouseLeave:g,onMouseUp:g,onMouseMove:y}:{};return n.createElement("div",{ref:f,className:o},n.createElement("div",r({"":"trackList"},w,{className:l,style:{transform:"translateX("+(e.transform-h.drag)+"px)",transition:"transform "+e.transition+"s ease 0s",width:s*e.items.length}}),e.items.map((function(e,t){return n.createElement("div",{key:t,style:{width:s,pointerEvents:h.pointers?"all":"none"},className:a},e)}))))},w={children:[],show:1,slide:1,transition:.5,swiping:!1,swipeOn:1,responsive:!1,infinite:!0,className:"",useArrowKeys:!1,a11y:{},dynamic:!1},_="styles-module_sliderBase__swkx1",L="styles-module_slider__o0fqa",b="styles-module_sliding__3T6T6";i(".styles-module_sliderBase__swkx1 {\n\twidth: 100%;\n\tposition: relative;\n}\n\n.styles-module_slider__o0fqa {\n\tdisplay: flex;\n\toverflow-x: auto;\n\tscrollbar-width: none; /* Firefox 64 */\n\t-ms-overflow-style: none; /* Internet Explorer 11 */\n}\n\n.styles-module_slider__o0fqa::-webkit-scrollbar {\n\t/** WebKit */\n\tdisplay: none;\n}\n\n.styles-module_slider__o0fqa > * {\n\tflex: 0 0 auto;\n}\n\n.styles-module_sliding__3T6T6 > * {\n\tpointer-events: none;\n}\n");exports.Carousel=function(e){var i=r(r({},w),e),o=t.useState(v(i.children,i.slide,i.infinite)),a=o[0],l=o[1],u=t.useState(0),p=u[0],_=u[1],L=t.useState({transform:0,transition:0,isSliding:!1}),b=L[0],k=L[1],E=t.useState(0),x=E[0],C=E[1],S=t.useState(m(i.children.length,i.show,i.infinite,x)),M=S[0],R=S[1];i.dynamic&&n.useEffect((function(){var t=g(a,e.children,i.slide,i.infinite);l(t)}),e.children);var T=function(e,t){if(!(b.isSliding||e===c.Right&&!M.right||e===c.Left&&!M.left)){var n=function(e,t,n,r){var i=e-r*t;return i<0?n+i:n<=i?i-n:i}(x,t,i.children.length,e),r=i.infinite?function(e,t,n,r,i,s){var o=new d(e,n),a=Array.from(t);switch(+s){case c.Left:for(var l=i;l>=0;l--)(i-l<0||!a[l-i])&&a.unshift(o.current()),o.prev();break;case c.Right:for(l=0;l<r+i;l++)a[2*i+l]||a.push(o.current()),o.next()}return a}(i.children,a,n,i.show,t,e):a;i.infinite&&e===c.Right&&l(r),k({transform:b.transform+h(p,t,e),transition:i.transition,isSliding:!0}),C(n),R(m(i.children.length,i.show,i.infinite,n)),setTimeout((function(){i.infinite&&l(function(e,t,n){return n===c.Left?e.slice(0,-1*t):e.slice(t)}(r,t,e)),k({transform:i.infinite?h(p,t,c.Right):b.transform+h(p,t,e),transition:0,isSliding:!1})}),1e3*i.transition)}};return n.createElement("div",r({},i.a11y,{"":"carousel",tabIndex:0},i.useArrowKeys?{onKeyDown:function(e){37===e.keyCode?T(c.Left,i.slide):39===e.keyCode&&T(c.Right,i.slide)}}:{},{className:s+" "+i.className}),M.left&&n.createElement(f,{direction:"left",onClick:function(){return T(c.Left,i.slide)}}),n.createElement(y,r({},i,{transition:b.transition,items:a,transform:b.transform,slideCallback:function(e){T(e,i.slide)},dragCallback:function(e){k({transform:e,transition:i.transition,isSliding:!1}),setTimeout((function(){return k(r(r({},b),{transition:0}))}),1e3*i.transition)},widthCallBack:function(e){_(e),k({transform:i.infinite?h(e,i.slide,c.Right):0,transition:0,isSliding:!1})}})),M.right&&n.createElement(f,{direction:"right",onClick:function(){return T(c.Right,i.slide)}}))},exports.ScrollingCarousel=function(e){var r=e.children,i=e.className,s=t.useRef(null),o=t.useState(!1),a=o[0],l=o[1],u=t.useState({startX:0,scrollLeft:0}),f=u[0],d=u[1],h=function(){var e=s.current;return{left:!!e&&e.scrollLeft>0,right:!!e&&e.scrollWidth>e.scrollLeft+e.offsetWidth}},m=t.useState(h()),v=m[0],p=m[1],g=function(e){p(h())},y=t.useCallback((function(e){null!==e&&(Object.defineProperty(s,"current",{value:e}),p(h()),e.addEventListener("scroll",g))}),[s,r]),w=function(e){l(!1),p(h()),s.current.classList.remove(b)},k=function(e){var t=function(e){for(var t,n,r=s.current,i=e===c.Left?r.scrollLeft+r.offsetWidth:r.scrollLeft,o=0,a=0,l=Array.from(r.children);a<l.length;a++){var u=l[a],f=(t=u,n=void 0,n=getComputedStyle(t),t.offsetWidth+(parseInt(n.marginLeft,10)||0)+(parseInt(n.marginRight,10)||0));if((o+=f)>=i){var d=e===c.Left?o-i:f;return(r.offsetWidth-d)*e}}return r.offsetWidth}(e),n=s.current.scrollLeft;E(500,t,n)},E=function(e,t,n){for(var r=0,i=0;r<=e;i++)window.setTimeout(x,r,i*t/100+n),r+=e/100},x=function(e){s.current.scrollLeft=e};return n.createElement("div",{className:_+" "+i},v.left&&n.createElement("div",{"data-arrow":"left"},n.createElement("button",{onClick:function(){return k(c.Right)}})),v.right&&n.createElement("div",{"data-arrow":"right"},n.createElement("button",{onClick:function(){return k(c.Left)}})),n.createElement("div",{ref:y,onMouseDown:function(e){l(!0),d({startX:e.pageX-s.current.offsetLeft,scrollLeft:s.current.scrollLeft})},onMouseLeave:w,onMouseUp:w,onMouseMove:function(e){if(a){e.preventDefault(),s.current.classList.add(b);var t=e.pageX-s.current.offsetLeft-f.startX;s.current.scrollLeft=f.scrollLeft-t}},className:L},r))};

dist/es/index.js

@@ -15,2 +15,2 @@ import e,{useState as t,useLayoutEffect as n,useCallback as r,useRef as i}from"react";
 and limitations under the License.
-***************************************************************************** */var o=function(){return(o=Object.assign||function(e){for(var t,n=1,r=arguments.length;n<r;n++)for(var i in t=arguments[n])Object.prototype.hasOwnProperty.call(t,i)&&(e[i]=t[i]);return e}).apply(this,arguments)};function s(e,t){void 0===t&&(t={});var n=t.insertAt;if(e&&"undefined"!=typeof document){var r=document.head||document.getElementsByTagName("head")[0],i=document.createElement("style");i.type="text/css","top"===n&&r.firstChild?r.insertBefore(i,r.firstChild):r.appendChild(i),i.styleSheet?i.styleSheet.cssText=e:i.appendChild(document.createTextNode(e))}}var a="styles-module_carousel-base__3keqD",l="styles-module_item-provider__YgMwz",c="styles-module_item-container__a8zaY",f="styles-module_item-tracker__3bypy",u="styles-module_carousel-arrow__26sRw";s(".styles-module_carousel-base__3keqD {\n\twidth: 100%;\n\tbox-sizing: border-box;\n\tdisplay: flex;\n\toutline: none;\n}\n\n.styles-module_item-provider__YgMwz {\n\toverflow: hidden;\n\twidth: 100%;\n\tcursor: pointer;\n}\n\n.styles-module_item-container__a8zaY img {\n\t-webkit-user-select: none;\n\t        user-select: none;\n\t-webkit-user-drag: none;\n}\n\n.styles-module_item-tracker__3bypy {\n\theight: 100%;\n\tdisplay: flex;\n}\n\n.styles-module_carousel-arrow__26sRw {\n\tz-index: 1;\n}\n");var d,h=function(t){return e.createElement("button",{className:u,onClick:t.onClick,"data-direction":t.direction})};!function(e){e[e.Right=-1]="Right",e[e.Left=1]="Left"}(d||(d={}));var m=function(){function e(e,t){this.arr=e,this.currentIndex=t}return e.prototype.next=function(){var e=this.currentIndex,t=this.arr;return this.currentIndex=e<t.length-1?e+1:0,this.current()},e.prototype.prev=function(){var e=this.currentIndex,t=this.arr;return this.currentIndex=e>0?e-1:t.length-1,this.current()},e.prototype.current=function(){return this.arr[this.currentIndex]},e}(),v=function(e,t,n){return n*e*t},g=function(e,t,n,r){var i=e>t;return n?{left:i,right:i}:{left:i&&0!==r,right:i&&r+t<e}};function p(e){return e.nativeEvent instanceof MouseEvent?e.nativeEvent.pageX:e.nativeEvent instanceof TouchEvent?e.nativeEvent.changedTouches[0].pageX:0}var w=function(i){var s=t(200),a=s[0],u=s[1],h=r((function(e){if(null!==e){var t=e.getBoundingClientRect().width/i.show;u(t),i.widthCallBack(t)}}),[a]);i.responsive&&function(e){var r=t(window.innerWidth),i=r[0],o=r[1];n((function(){var t=function(){var t=i-window.innerWidth;o(window.innerWidth),e(t)};return window.addEventListener("resize",t),function(){return window.removeEventListener("resize",t)}}),[])}((function(e){u(a-e)}));var m=t({initial:i.transform,start:0,isDown:!1,drag:0,finished:!0,pointers:!0}),v=m[0],g=m[1],w=function(e){e.persist(),g(o(o({},v),{isDown:!0,start:p(e),initial:i.transform,finished:!1}))},y=function(e){if(e.persist(),!v.finished){if(Math.abs(v.drag)<a*i.swipeOn)return i.dragCallback(i.transform),g({initial:i.transform,start:0,isDown:!1,drag:0,finished:!0,pointers:!0});i.slideCallback(v.drag>0?d.Right:d.Left),g(o(o({},v),{drag:0,isDown:!1,finished:!0,pointers:!0}))}},_=function(e){if(e.persist(),v.isDown){var t=p(e);g(o(o({},v),{drag:v.start-t,pointers:!1}))}},L=i.swiping?{onTouchCancel:y,onTouchEnd:y,onTouchMove:_,onTouchStart:w,onMouseDown:w,onMouseLeave:y,onMouseUp:y,onMouseMove:_}:{};return e.createElement("div",{ref:h,className:l},e.createElement("div",o({"":"trackList"},L,{className:f,style:{transform:"translateX("+(i.transform-v.drag)+"px)",transition:"transform "+i.transition+"s ease 0s",width:a*i.items.length}}),i.items.map((function(t,n){return e.createElement("div",{key:n,style:{width:a,pointerEvents:v.pointers?"all":"none"},className:c},t)}))))},y={children:[],show:1,slide:1,transition:.5,swiping:!1,swipeOn:1,responsive:!1,infinite:!0,className:"",useArrowKeys:!1,a11y:{},dynamic:!1},_=function(n){var r=o(o({},y),n),i=t(function(e,t,n){if(!n)return e;for(var r=Array.from(e),i=new m(e,0),o=0;o<t;o++)r.unshift(i.prev());return r}(r.children,r.slide,r.infinite)),s=i[0],l=i[1],c=t(0),f=c[0],u=c[1],p=t({transform:0,transition:0,isSliding:!1}),_=p[0],L=p[1],E=t(0),k=E[0],b=E[1],x=t(g(r.children.length,r.show,r.infinite,k)),C=x[0],T=x[1];r.dynamic&&e.useEffect((function(){var e=function(e,t){return e.map((function(e){return t.find((function(t){return e.key===t.key}))}))}(s,n.children);l(e)}),n.children);var M=function(e,t){if(!(_.isSliding||e===d.Right&&!C.right||e===d.Left&&!C.left)){var n=function(e,t,n,r){var i=e-r*t;return i<0?n+i:n<=i?i-n:i}(k,t,r.children.length,e),i=r.infinite?function(e,t,n,r,i,o){var s=new m(e,n),a=Array.from(t);switch(+o){case d.Left:for(var l=i;l>=0;l--)(i-l<0||!a[l-i])&&a.unshift(s.current()),s.prev();break;case d.Right:for(l=0;l<r+i;l++)a[2*i+l]||a.push(s.current()),s.next()}return a}(r.children,s,n,r.show,t,e):s;r.infinite&&e===d.Right&&l(i),L({transform:_.transform+v(f,t,e),transition:r.transition,isSliding:!0}),b(n),T(g(r.children.length,r.show,r.infinite,n)),setTimeout((function(){r.infinite&&l(function(e,t,n){return n===d.Left?e.slice(0,-1*t):e.slice(t)}(i,t,e)),L({transform:r.infinite?v(f,t,d.Right):_.transform+v(f,t,e),transition:0,isSliding:!1})}),1e3*r.transition)}};return e.createElement("div",o({},r.a11y,{"":"carousel",tabIndex:0},r.useArrowKeys?{onKeyDown:function(e){37===e.keyCode?M(d.Left,r.slide):39===e.keyCode&&M(d.Right,r.slide)}}:{},{className:a+" "+r.className}),C.left&&e.createElement(h,{direction:"left",onClick:function(){return M(d.Left,r.slide)}}),e.createElement(w,o({},r,{transition:_.transition,items:s,transform:_.transform,slideCallback:function(e){M(e,r.slide)},dragCallback:function(e){L({transform:e,transition:r.transition,isSliding:!1}),setTimeout((function(){return L(o(o({},_),{transition:0}))}),1e3*r.transition)},widthCallBack:function(e){u(e),L({transform:r.infinite?v(e,r.slide,d.Right):0,transition:0,isSliding:!1})}})),C.right&&e.createElement(h,{direction:"right",onClick:function(){return M(d.Right,r.slide)}}))},L="styles-module_sliderBase__swkx1",E="styles-module_slider__o0fqa",k="styles-module_sliding__3T6T6";s(".styles-module_sliderBase__swkx1 {\n\twidth: 100%;\n\tposition: relative;\n}\n\n.styles-module_slider__o0fqa {\n\tdisplay: flex;\n\toverflow-x: auto;\n\tscrollbar-width: none; /* Firefox 64 */\n\t-ms-overflow-style: none; /* Internet Explorer 11 */\n}\n\n.styles-module_slider__o0fqa::-webkit-scrollbar {\n\t/** WebKit */\n\tdisplay: none;\n}\n\n.styles-module_slider__o0fqa > * {\n\tflex: 0 0 auto;\n}\n\n.styles-module_sliding__3T6T6 > * {\n\tpointer-events: none;\n}\n");var b=function(n){var o=n.children,s=n.className,a=i(null),l=t(!1),c=l[0],f=l[1],u=t({startX:0,scrollLeft:0}),h=u[0],m=u[1],v=function(){var e=a.current;return{left:!!e&&e.scrollLeft>0,right:!!e&&e.scrollWidth>e.scrollLeft+e.offsetWidth}},g=t(v()),p=g[0],w=g[1],y=function(e){w(v())},_=r((function(e){null!==e&&(Object.defineProperty(a,"current",{value:e}),w(v()),e.addEventListener("scroll",y))}),[a,o]),b=function(e){f(!1),w(v()),a.current.classList.remove(k)},x=function(e){var t=function(e){for(var t,n,r=a.current,i=e===d.Left?r.scrollLeft+r.offsetWidth:r.scrollLeft,o=0,s=0,l=Array.from(r.children);s<l.length;s++){var c=l[s],f=(t=c,n=void 0,n=getComputedStyle(t),t.offsetWidth+(parseInt(n.marginLeft,10)||0)+(parseInt(n.marginRight,10)||0));if((o+=f)>=i){var u=e===d.Left?o-i:f;return(r.offsetWidth-u)*e}}return r.offsetWidth}(e),n=a.current.scrollLeft;C(500,t,n)},C=function(e,t,n){for(var r=0,i=0;r<=e;i++)window.setTimeout(T,r,i*t/100+n),r+=e/100},T=function(e){a.current.scrollLeft=e};return e.createElement("div",{className:L+" "+s},p.left&&e.createElement("div",{"data-arrow":"left"},e.createElement("button",{onClick:function(){return x(d.Right)}})),p.right&&e.createElement("div",{"data-arrow":"right"},e.createElement("button",{onClick:function(){return x(d.Left)}})),e.createElement("div",{ref:_,onMouseDown:function(e){f(!0),m({startX:e.pageX-a.current.offsetLeft,scrollLeft:a.current.scrollLeft})},onMouseLeave:b,onMouseUp:b,onMouseMove:function(e){if(c){e.preventDefault(),a.current.classList.add(k);var t=e.pageX-a.current.offsetLeft-h.startX;a.current.scrollLeft=h.scrollLeft-t}},className:E},o))};export{_ as Carousel,b as ScrollingCarousel};
+***************************************************************************** */var o=function(){return(o=Object.assign||function(e){for(var t,n=1,r=arguments.length;n<r;n++)for(var i in t=arguments[n])Object.prototype.hasOwnProperty.call(t,i)&&(e[i]=t[i]);return e}).apply(this,arguments)};function s(e,t){void 0===t&&(t={});var n=t.insertAt;if(e&&"undefined"!=typeof document){var r=document.head||document.getElementsByTagName("head")[0],i=document.createElement("style");i.type="text/css","top"===n&&r.firstChild?r.insertBefore(i,r.firstChild):r.appendChild(i),i.styleSheet?i.styleSheet.cssText=e:i.appendChild(document.createTextNode(e))}}var a="styles-module_carousel-base__3keqD",l="styles-module_item-provider__YgMwz",c="styles-module_item-container__a8zaY",f="styles-module_item-tracker__3bypy",u="styles-module_carousel-arrow__26sRw";s(".styles-module_carousel-base__3keqD {\n\twidth: 100%;\n\tbox-sizing: border-box;\n\tdisplay: flex;\n\toutline: none;\n}\n\n.styles-module_item-provider__YgMwz {\n\toverflow: hidden;\n\twidth: 100%;\n\tcursor: pointer;\n}\n\n.styles-module_item-container__a8zaY img {\n\t-webkit-user-select: none;\n\t        user-select: none;\n\t-webkit-user-drag: none;\n}\n\n.styles-module_item-tracker__3bypy {\n\theight: 100%;\n\tdisplay: flex;\n}\n\n.styles-module_carousel-arrow__26sRw {\n\tz-index: 1;\n}\n");var d,h=function(t){return e.createElement("button",{className:u,onClick:t.onClick,"data-direction":t.direction})};!function(e){e[e.Right=-1]="Right",e[e.Left=1]="Left"}(d||(d={}));var m=function(){function e(e,t){this.arr=e,this.currentIndex=t}return e.prototype.next=function(){var e=this.currentIndex,t=this.arr;return this.currentIndex=e<t.length-1?e+1:0,this.current()},e.prototype.prev=function(){var e=this.currentIndex,t=this.arr;return this.currentIndex=e>0?e-1:t.length-1,this.current()},e.prototype.current=function(){return this.arr[this.currentIndex]},e}(),v=function(e,t,n){return n*e*t},g=function(e,t,n,r){var i=e>t;return n?{left:i,right:i}:{left:i&&0!==r,right:i&&r+t<e}},p=function(e,t,n){if(!n)return e;for(var r=Array.from(e),i=new m(e,0),o=0;o<t;o++)r.unshift(i.prev());return r};function w(e){return e.nativeEvent instanceof MouseEvent?e.nativeEvent.pageX:e.nativeEvent instanceof TouchEvent?e.nativeEvent.changedTouches[0].pageX:0}function y(e,t,n,r){var i=e.map((function(e){return t.find((function(t){return e.key===t.key}))}));return i.some((function(e){return void 0===e}))?p(t,n,r):i}var _=function(i){var s=t(200),a=s[0],u=s[1],h=r((function(e){if(null!==e){var t=e.getBoundingClientRect().width/i.show;u(t),i.widthCallBack(t)}}),[a]);i.responsive&&function(e){var r=t(window.innerWidth),i=r[0],o=r[1];n((function(){var t=function(){var t=i-window.innerWidth;o(window.innerWidth),e(t)};return window.addEventListener("resize",t),function(){return window.removeEventListener("resize",t)}}),[])}((function(e){u(a-e)}));var m=t({initial:i.transform,start:0,isDown:!1,drag:0,finished:!0,pointers:!0}),v=m[0],g=m[1],p=function(e){e.persist(),g(o(o({},v),{isDown:!0,start:w(e),initial:i.transform,finished:!1}))},y=function(e){if(e.persist(),!v.finished){if(Math.abs(v.drag)<a*i.swipeOn)return i.dragCallback(i.transform),g({initial:i.transform,start:0,isDown:!1,drag:0,finished:!0,pointers:!0});i.slideCallback(v.drag>0?d.Right:d.Left),g(o(o({},v),{drag:0,isDown:!1,finished:!0,pointers:!0}))}},_=function(e){if(e.persist(),v.isDown){var t=w(e);g(o(o({},v),{drag:v.start-t,pointers:!1}))}},L=i.swiping?{onTouchCancel:y,onTouchEnd:y,onTouchMove:_,onTouchStart:p,onMouseDown:p,onMouseLeave:y,onMouseUp:y,onMouseMove:_}:{};return e.createElement("div",{ref:h,className:l},e.createElement("div",o({"":"trackList"},L,{className:f,style:{transform:"translateX("+(i.transform-v.drag)+"px)",transition:"transform "+i.transition+"s ease 0s",width:a*i.items.length}}),i.items.map((function(t,n){return e.createElement("div",{key:n,style:{width:a,pointerEvents:v.pointers?"all":"none"},className:c},t)}))))},L={children:[],show:1,slide:1,transition:.5,swiping:!1,swipeOn:1,responsive:!1,infinite:!0,className:"",useArrowKeys:!1,a11y:{},dynamic:!1},E=function(n){var r=o(o({},L),n),i=t(p(r.children,r.slide,r.infinite)),s=i[0],l=i[1],c=t(0),f=c[0],u=c[1],w=t({transform:0,transition:0,isSliding:!1}),E=w[0],k=w[1],b=t(0),x=b[0],C=b[1],T=t(g(r.children.length,r.show,r.infinite,x)),M=T[0],R=T[1];r.dynamic&&e.useEffect((function(){var e=y(s,n.children,r.slide,r.infinite);l(e)}),n.children);var N=function(e,t){if(!(E.isSliding||e===d.Right&&!M.right||e===d.Left&&!M.left)){var n=function(e,t,n,r){var i=e-r*t;return i<0?n+i:n<=i?i-n:i}(x,t,r.children.length,e),i=r.infinite?function(e,t,n,r,i,o){var s=new m(e,n),a=Array.from(t);switch(+o){case d.Left:for(var l=i;l>=0;l--)(i-l<0||!a[l-i])&&a.unshift(s.current()),s.prev();break;case d.Right:for(l=0;l<r+i;l++)a[2*i+l]||a.push(s.current()),s.next()}return a}(r.children,s,n,r.show,t,e):s;r.infinite&&e===d.Right&&l(i),k({transform:E.transform+v(f,t,e),transition:r.transition,isSliding:!0}),C(n),R(g(r.children.length,r.show,r.infinite,n)),setTimeout((function(){r.infinite&&l(function(e,t,n){return n===d.Left?e.slice(0,-1*t):e.slice(t)}(i,t,e)),k({transform:r.infinite?v(f,t,d.Right):E.transform+v(f,t,e),transition:0,isSliding:!1})}),1e3*r.transition)}};return e.createElement("div",o({},r.a11y,{"":"carousel",tabIndex:0},r.useArrowKeys?{onKeyDown:function(e){37===e.keyCode?N(d.Left,r.slide):39===e.keyCode&&N(d.Right,r.slide)}}:{},{className:a+" "+r.className}),M.left&&e.createElement(h,{direction:"left",onClick:function(){return N(d.Left,r.slide)}}),e.createElement(_,o({},r,{transition:E.transition,items:s,transform:E.transform,slideCallback:function(e){N(e,r.slide)},dragCallback:function(e){k({transform:e,transition:r.transition,isSliding:!1}),setTimeout((function(){return k(o(o({},E),{transition:0}))}),1e3*r.transition)},widthCallBack:function(e){u(e),k({transform:r.infinite?v(e,r.slide,d.Right):0,transition:0,isSliding:!1})}})),M.right&&e.createElement(h,{direction:"right",onClick:function(){return N(d.Right,r.slide)}}))},k="styles-module_sliderBase__swkx1",b="styles-module_slider__o0fqa",x="styles-module_sliding__3T6T6";s(".styles-module_sliderBase__swkx1 {\n\twidth: 100%;\n\tposition: relative;\n}\n\n.styles-module_slider__o0fqa {\n\tdisplay: flex;\n\toverflow-x: auto;\n\tscrollbar-width: none; /* Firefox 64 */\n\t-ms-overflow-style: none; /* Internet Explorer 11 */\n}\n\n.styles-module_slider__o0fqa::-webkit-scrollbar {\n\t/** WebKit */\n\tdisplay: none;\n}\n\n.styles-module_slider__o0fqa > * {\n\tflex: 0 0 auto;\n}\n\n.styles-module_sliding__3T6T6 > * {\n\tpointer-events: none;\n}\n");var C=function(n){var o=n.children,s=n.className,a=i(null),l=t(!1),c=l[0],f=l[1],u=t({startX:0,scrollLeft:0}),h=u[0],m=u[1],v=function(){var e=a.current;return{left:!!e&&e.scrollLeft>0,right:!!e&&e.scrollWidth>e.scrollLeft+e.offsetWidth}},g=t(v()),p=g[0],w=g[1],y=function(e){w(v())},_=r((function(e){null!==e&&(Object.defineProperty(a,"current",{value:e}),w(v()),e.addEventListener("scroll",y))}),[a,o]),L=function(e){f(!1),w(v()),a.current.classList.remove(x)},E=function(e){var t=function(e){for(var t,n,r=a.current,i=e===d.Left?r.scrollLeft+r.offsetWidth:r.scrollLeft,o=0,s=0,l=Array.from(r.children);s<l.length;s++){var c=l[s],f=(t=c,n=void 0,n=getComputedStyle(t),t.offsetWidth+(parseInt(n.marginLeft,10)||0)+(parseInt(n.marginRight,10)||0));if((o+=f)>=i){var u=e===d.Left?o-i:f;return(r.offsetWidth-u)*e}}return r.offsetWidth}(e),n=a.current.scrollLeft;C(500,t,n)},C=function(e,t,n){for(var r=0,i=0;r<=e;i++)window.setTimeout(T,r,i*t/100+n),r+=e/100},T=function(e){a.current.scrollLeft=e};return e.createElement("div",{className:k+" "+s},p.left&&e.createElement("div",{"data-arrow":"left"},e.createElement("button",{onClick:function(){return E(d.Right)}})),p.right&&e.createElement("div",{"data-arrow":"right"},e.createElement("button",{onClick:function(){return E(d.Left)}})),e.createElement("div",{ref:_,onMouseDown:function(e){f(!0),m({startX:e.pageX-a.current.offsetLeft,scrollLeft:a.current.scrollLeft})},onMouseLeave:L,onMouseUp:L,onMouseMove:function(e){if(c){e.preventDefault(),a.current.classList.add(x);var t=e.pageX-a.current.offsetLeft-h.startX;a.current.scrollLeft=h.scrollLeft-t}},className:b},o))};export{E as Carousel,C as ScrollingCarousel};

dist/types/components/carousel/index.d.ts

@@ -18,3 +18,3 @@ import { FunctionComponent } from 'react';
     };
-    dynamic: boolean;
+    dynamic?: boolean;
 }
@@ -21,0 +21,0 @@ export interface CarouselState {

dist/types/helpers/index.d.ts

@@ -22,2 +22,3 @@ import { MouseEvent, TouchEvent } from 'react';
 export declare function getOuterWidth(el: HTMLElement): number;
-export declare function updateNodes(oldItems: Item[], newItems: Item[]): Item[];
+export declare function updateNodes(oldItems: Item[], newItems: Item[], slide: number, infinite: boolean): Item[];
+export declare function areItemsNotMatched(items: Item[]): boolean;

package.json

 {
 	"name": "@trendyol-js/react-carousel",
-	"version": "1.0.6",
+	"version": "1.0.7-beta.1",
 	"description": "Lightweight carousel component for react",
@@ -5,0 +5,0 @@ "main": "dist/cjs/index.js",

New alerts

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

25841

1.12%

Lines of code

177

0.57%

Worsened metrics

Number of low quality alerts

2

100%

No dependency changes