@progress/kendo-react-scrollview 5.14.0-dev.202305191608 → 5.14.0-dev.202305250741

package/dist/es/ScrollView.js

@@ -72,22 +72,6 @@ export var ScrollView = React.forwardRef(function (props, target) {
             active < data.length ? setActive(active + 1) : setActive(1);
         }
     }, [active, data.length, endless]);
-    var handlePrevClick = React.useCallback(function () {
-        if (!isRtl) {
-            prev();
-        }
-        else {
-            next();
-        }
-    }, [isRtl, prev, next]);
-    var handleNextClick = React.useCallback(function () {
-        if (!isRtl) {
-            next();
-        }
-        else {
-            prev();
-        }
-    }, [isRtl, next, prev]);
     React.useEffect(function () {
         var viewsCount = data.length;
         if (wrapElementRef.current) {
@@ -137,39 +121,29 @@ export var ScrollView = React.forwardRef(function (props, target) {
                 break;
         }
     }, [isRtl, next, prev]);
-    var scrollViewClasses = React.useMemo(function () { return classNames('k-widget k-scrollview', {
+    var scrollViewClasses = React.useMemo(function () { return classNames('k-scrollview', {
         'k-scrollview-light': pagerOverlay === 'light',
         'k-scrollview-dark': pagerOverlay === 'dark'
     }, className); }, [className, pagerOverlay]);
     var content = React.Children.map(children || null, function (child, index) { return (React.createElement("div", { className: "k-scrollview-view", "aria-hidden": active === index + 1 ? false : true }, child)); });
     var displayLeftArrow = React.useCallback(function () {
         var isNotBorderItem;
-        if (isRtl) {
-            isNotBorderItem = active < data.length;
-        }
-        else {
-            isNotBorderItem = active > 1;
-        }
+        isNotBorderItem = active > 1;
         return (endless || isNotBorderItem) && data.length > 0;
-    }, [active, data.length, endless, isRtl]);
+    }, [active, data.length, endless]);
     var displayRightArrow = React.useCallback(function () {
         var isNotBorderItem;
-        if (isRtl) {
-            isNotBorderItem = active > 1;
-        }
-        else {
-            isNotBorderItem = active < data.length;
-        }
+        isNotBorderItem = active < data.length;
         return (endless || isNotBorderItem) && data.length > 0;
-    }, [active, data.length, endless, isRtl]);
+    }, [active, data.length, endless]);
     return (React.createElement("div", { className: scrollViewClasses, style: style, ref: elementRef, tabIndex: 0, dir: dir, onKeyDown: handleKeyDown },
         React.createElement("div", { className: "k-scrollview-wrap k-scrollview-animate", ref: wrapElementRef }, content),
         React.createElement("div", { className: "k-scrollview-elements" },
             arrows && (React.createElement(React.Fragment, null,
-                displayLeftArrow() && React.createElement("a", { className: "k-scrollview-prev", "aria-label": "previous", onClick: handlePrevClick },
-                    React.createElement(IconWrap, { name: "chevron-left", icon: chevronLeftIcon })),
-                displayRightArrow() && React.createElement("a", { className: "k-scrollview-next", onClick: handleNextClick },
-                    React.createElement(IconWrap, { name: "chevron-right", icon: chevronRightIcon })))),
+                displayLeftArrow() && React.createElement("a", { className: "k-scrollview-prev", "aria-label": "previous", onClick: prev },
+                    React.createElement(IconWrap, { name: isRtl ? 'chevron-right' : 'chevron-left', icon: isRtl ? chevronRightIcon : chevronLeftIcon, size: 'xxxlarge' })),
+                displayRightArrow() && React.createElement("a", { className: "k-scrollview-next", onClick: next },
+                    React.createElement(IconWrap, { name: isRtl ? 'chevron-left' : 'chevron-right', icon: isRtl ? chevronLeftIcon : chevronRightIcon, size: 'xxxlarge' })))),
             pageable && (React.createElement("div", { className: "k-scrollview-nav-wrap" },
                 React.createElement("ul", { className: "k-scrollview-nav" }, data.map(function (_, index) {
                     return (React.createElement("li", { className: classNames('k-link', {

package/dist/es/package-metadata.js

@@ -5,7 +5,7 @@ export var packageMetadata = {
     name: '@progress/kendo-react-scrollview',
     productName: 'KendoReact',
     productCodes: ['KENDOUIREACT', 'KENDOUICOMPLETE'],
-    publishDate: 1684511592,
+    publishDate: 1684999481,
     version: '',
     licensingDocsUrl: 'https://www.telerik.com/kendo-react-ui/my-license/?utm_medium=product&utm_source=kendoreact&utm_campaign=kendo-ui-react-purchase-license-keys-warning'
 };

package/dist/npm/ScrollView.js

@@ -75,22 +75,6 @@ exports.ScrollView = React.forwardRef(function (props, target) {
             active < data.length ? setActive(active + 1) : setActive(1);
         }
     }, [active, data.length, endless]);
-    var handlePrevClick = React.useCallback(function () {
-        if (!isRtl) {
-            prev();
-        }
-        else {
-            next();
-        }
-    }, [isRtl, prev, next]);
-    var handleNextClick = React.useCallback(function () {
-        if (!isRtl) {
-            next();
-        }
-        else {
-            prev();
-        }
-    }, [isRtl, next, prev]);
     React.useEffect(function () {
         var viewsCount = data.length;
         if (wrapElementRef.current) {
@@ -140,39 +124,29 @@ exports.ScrollView = React.forwardRef(function (props, target) {
                 break;
         }
     }, [isRtl, next, prev]);
-    var scrollViewClasses = React.useMemo(function () { return (0, kendo_react_common_1.classNames)('k-widget k-scrollview', {
+    var scrollViewClasses = React.useMemo(function () { return (0, kendo_react_common_1.classNames)('k-scrollview', {
         'k-scrollview-light': pagerOverlay === 'light',
         'k-scrollview-dark': pagerOverlay === 'dark'
     }, className); }, [className, pagerOverlay]);
     var content = React.Children.map(children || null, function (child, index) { return (React.createElement("div", { className: "k-scrollview-view", "aria-hidden": active === index + 1 ? false : true }, child)); });
     var displayLeftArrow = React.useCallback(function () {
         var isNotBorderItem;
-        if (isRtl) {
-            isNotBorderItem = active < data.length;
-        }
-        else {
-            isNotBorderItem = active > 1;
-        }
+        isNotBorderItem = active > 1;
         return (endless || isNotBorderItem) && data.length > 0;
-    }, [active, data.length, endless, isRtl]);
+    }, [active, data.length, endless]);
     var displayRightArrow = React.useCallback(function () {
         var isNotBorderItem;
-        if (isRtl) {
-            isNotBorderItem = active > 1;
-        }
-        else {
-            isNotBorderItem = active < data.length;
-        }
+        isNotBorderItem = active < data.length;
         return (endless || isNotBorderItem) && data.length > 0;
-    }, [active, data.length, endless, isRtl]);
+    }, [active, data.length, endless]);
     return (React.createElement("div", { className: scrollViewClasses, style: style, ref: elementRef, tabIndex: 0, dir: dir, onKeyDown: handleKeyDown },
         React.createElement("div", { className: "k-scrollview-wrap k-scrollview-animate", ref: wrapElementRef }, content),
         React.createElement("div", { className: "k-scrollview-elements" },
             arrows && (React.createElement(React.Fragment, null,
-                displayLeftArrow() && React.createElement("a", { className: "k-scrollview-prev", "aria-label": "previous", onClick: handlePrevClick },
-                    React.createElement(kendo_react_common_1.IconWrap, { name: "chevron-left", icon: kendo_svg_icons_1.chevronLeftIcon })),
-                displayRightArrow() && React.createElement("a", { className: "k-scrollview-next", onClick: handleNextClick },
-                    React.createElement(kendo_react_common_1.IconWrap, { name: "chevron-right", icon: kendo_svg_icons_1.chevronRightIcon })))),
+                displayLeftArrow() && React.createElement("a", { className: "k-scrollview-prev", "aria-label": "previous", onClick: prev },
+                    React.createElement(kendo_react_common_1.IconWrap, { name: isRtl ? 'chevron-right' : 'chevron-left', icon: isRtl ? kendo_svg_icons_1.chevronRightIcon : kendo_svg_icons_1.chevronLeftIcon, size: 'xxxlarge' })),
+                displayRightArrow() && React.createElement("a", { className: "k-scrollview-next", onClick: next },
+                    React.createElement(kendo_react_common_1.IconWrap, { name: isRtl ? 'chevron-left' : 'chevron-right', icon: isRtl ? kendo_svg_icons_1.chevronLeftIcon : kendo_svg_icons_1.chevronRightIcon, size: 'xxxlarge' })))),
             pageable && (React.createElement("div", { className: "k-scrollview-nav-wrap" },
                 React.createElement("ul", { className: "k-scrollview-nav" }, data.map(function (_, index) {
                     return (React.createElement("li", { className: (0, kendo_react_common_1.classNames)('k-link', {

package/dist/npm/package-metadata.js

@@ -8,7 +8,7 @@ exports.packageMetadata = {
     name: '@progress/kendo-react-scrollview',
     productName: 'KendoReact',
     productCodes: ['KENDOUIREACT', 'KENDOUICOMPLETE'],
-    publishDate: 1684511592,
+    publishDate: 1684999481,
     version: '',
     licensingDocsUrl: 'https://www.telerik.com/kendo-react-ui/my-license/?utm_medium=product&utm_source=kendoreact&utm_campaign=kendo-ui-react-purchase-license-keys-warning'
 };

package/dist/systemjs/kendo-react-scrollview.js

@@ -1 +1 @@
-System.register("@progress/kendo-react-scrollview",["@progress/kendo-react-common","@progress/kendo-svg-icons","prop-types","react"],function(e,t){var r={},c={},l={},o={};return Object.defineProperty(r,"__esModule",{value:!0}),Object.defineProperty(c,"__esModule",{value:!0}),Object.defineProperty(l,"__esModule",{value:!0}),Object.defineProperty(o,"__esModule",{value:!0}),{setters:[function(t){Object.keys(t).forEach(function(e){r[e]=t[e]})},function(t){Object.keys(t).forEach(function(e){c[e]=t[e]})},function(t){Object.keys(t).forEach(function(e){l[e]=t[e]})},function(t){Object.keys(t).forEach(function(e){o[e]=t[e]})}],execute:function(){e((()=>{"use strict";var n={850:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.ScrollView=void 0;var N=r(954),n=r(895),P=r(811),V=r(811),M=r(363),x=r(233);t.ScrollView=N.forwardRef(function(e,t){(0,V.validatePackage)(M.packageMetadata);var r=e.className,n=e.style,a=e.children,c=e.pagerOverlay,l=e.pageable,o=e.arrows,i=e.endless,s=e.activeView,u=e.automaticViewChange,f=e.automaticViewChangeInterval,s=N.useState(s||1),d=s[0],v=s[1],p=N.useRef(null),m=N.useRef(null),g=N.useRef(null),k=N.Children.toArray(a),s=(0,P.useRtl)(p,e.dir),w="rtl"===s,h=N.useCallback(function(){p.current&&p.current.focus()},[]),e=N.useCallback(function(){return{element:p.current,focus:h}},[h]),b=(N.useImperativeHandle(t,e),N.useCallback(function(){i?v(1<d?d-1:k.length):1<d&&v(d-1)},[d,k.length,i])),y=N.useCallback(function(){i?d<k.length?v(d+1):v(1):d<k.length&&v(d+1)},[d,k.length,i]),t=N.useCallback(function(){(w?y:b)()},[w,b,y]),e=N.useCallback(function(){(w?b:y)()},[w,y,b]);function _(){g.current&&clearTimeout(g.current)}N.useEffect(function(){var e=k.length;m.current&&(m.current.style.setProperty("--kendo-scrollview-views","".concat(e)),m.current.style.setProperty("--kendo-scrollview-current","".concat(d)))},[k,d,s]),N.useEffect(function(){if(u)return _(),g.current=setTimeout(function(){return v(function(e){return e===k.length?i?1:e:e+1})},f),function(){_()}},[u,f,k.length,d,i]);var C=N.useCallback(function(e){switch(e.keyCode){case P.Keys.left:e.preventDefault(),(w?y:b)();break;case P.Keys.right:e.preventDefault(),(w?b:y)()}},[w,y,b]),O=N.useMemo(function(){return(0,P.classNames)("k-widget k-scrollview",{"k-scrollview-light":"light"===c,"k-scrollview-dark":"dark"===c},r)},[r,c]),a=N.Children.map(a||null,function(e,t){return N.createElement("div",{className:"k-scrollview-view","aria-hidden":d!==t+1},e)}),E=N.useCallback(function(){var e=w?d<k.length:1<d;return(i||e)&&0<k.length},[d,k.length,i,w]),j=N.useCallback(function(){var e=w?1<d:d<k.length;return(i||e)&&0<k.length},[d,k.length,i,w]);return N.createElement("div",{className:O,style:n,ref:p,tabIndex:0,dir:s,onKeyDown:C},N.createElement("div",{className:"k-scrollview-wrap k-scrollview-animate",ref:m},a),N.createElement("div",{className:"k-scrollview-elements"},o&&N.createElement(N.Fragment,null,E()&&N.createElement("a",{className:"k-scrollview-prev","aria-label":"previous",onClick:t},N.createElement(P.IconWrap,{name:"chevron-left",icon:x.chevronLeftIcon})),j()&&N.createElement("a",{className:"k-scrollview-next",onClick:e},N.createElement(P.IconWrap,{name:"chevron-right",icon:x.chevronRightIcon}))),l&&N.createElement("div",{className:"k-scrollview-nav-wrap"},N.createElement("ul",{className:"k-scrollview-nav"},k.map(function(e,t){return N.createElement("li",{className:(0,P.classNames)("k-link",{"k-primary":d===t+1}),key:t+1,onClick:function(){return v(t+1)}})})))))}),t.ScrollView.propTypes={activeView:n.number,arrows:n.bool,automaticViewChange:n.bool,automaticViewChangeInterval:n.number,children:n.any,className:n.string,dir:n.string,endless:n.bool,pageable:n.bool,pageOverlay:n.string,style:n.object},t.ScrollView.defaultProps={activeView:1,arrows:!0,automaticViewChange:!0,automaticViewChangeInterval:5e3,endless:!1,pageable:!0,pageOverlay:"none"},t.ScrollView.displayName="KendoScrollView"},271:(e,t)=>{Object.defineProperty(t,"__esModule",{value:!0})},468:function(e,t,r){var n=this&&this.__createBinding||(Object.create?function(e,t,r,n){void 0===n&&(n=r);var a=Object.getOwnPropertyDescriptor(t,r);a&&!("get"in a?!t.__esModule:a.writable||a.configurable)||(a={enumerable:!0,get:function(){return t[r]}}),Object.defineProperty(e,n,a)}:function(e,t,r,n){e[n=void 0===n?r:n]=t[r]}),a=this&&this.__exportStar||function(e,t){for(var r in e)"default"===r||Object.prototype.hasOwnProperty.call(t,r)||n(t,e,r)};Object.defineProperty(t,"__esModule",{value:!0}),a(r(850),t),a(r(271),t)},363:(e,t)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.packageMetadata=void 0,t.packageMetadata={name:"@progress/kendo-react-scrollview",productName:"KendoReact",productCodes:["KENDOUIREACT","KENDOUICOMPLETE"],publishDate:1684511592,version:"",licensingDocsUrl:"https://www.telerik.com/kendo-react-ui/my-license/?utm_medium=product&utm_source=kendoreact&utm_campaign=kendo-ui-react-purchase-license-keys-warning"}},811:e=>{e.exports=r},233:e=>{e.exports=c},895:e=>{e.exports=l},954:e=>{e.exports=o}},a={};return function e(t){var r=a[t];return void 0!==r||(r=a[t]={exports:{}},n[t].call(r.exports,r,r.exports,e)),r.exports}(468)})())}}});
+System.register("@progress/kendo-react-scrollview",["@progress/kendo-react-common","@progress/kendo-svg-icons","prop-types","react"],function(e,t){var r={},c={},l={},o={};return Object.defineProperty(r,"__esModule",{value:!0}),Object.defineProperty(c,"__esModule",{value:!0}),Object.defineProperty(l,"__esModule",{value:!0}),Object.defineProperty(o,"__esModule",{value:!0}),{setters:[function(t){Object.keys(t).forEach(function(e){r[e]=t[e]})},function(t){Object.keys(t).forEach(function(e){c[e]=t[e]})},function(t){Object.keys(t).forEach(function(e){l[e]=t[e]})},function(t){Object.keys(t).forEach(function(e){o[e]=t[e]})}],execute:function(){e((()=>{"use strict";var n={850:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.ScrollView=void 0;var C=r(954),n=r(895),x=r(811),j=r(811),N=r(363),P=r(233);t.ScrollView=C.forwardRef(function(e,t){(0,j.validatePackage)(N.packageMetadata);var r=e.className,n=e.style,a=e.children,c=e.pagerOverlay,l=e.pageable,o=e.arrows,i=e.endless,s=e.activeView,u=e.automaticViewChange,v=e.automaticViewChangeInterval,s=C.useState(s||1),f=s[0],d=s[1],p=C.useRef(null),m=C.useRef(null),g=C.useRef(null),h=C.Children.toArray(a),s=(0,x.useRtl)(p,e.dir),k="rtl"===s,w=C.useCallback(function(){p.current&&p.current.focus()},[]),e=C.useCallback(function(){return{element:p.current,focus:w}},[w]),b=(C.useImperativeHandle(t,e),C.useCallback(function(){i?d(1<f?f-1:h.length):1<f&&d(f-1)},[f,h.length,i])),y=C.useCallback(function(){i?f<h.length?d(f+1):d(1):f<h.length&&d(f+1)},[f,h.length,i]);function _(){g.current&&clearTimeout(g.current)}C.useEffect(function(){var e=h.length;m.current&&(m.current.style.setProperty("--kendo-scrollview-views","".concat(e)),m.current.style.setProperty("--kendo-scrollview-current","".concat(f)))},[h,f,s]),C.useEffect(function(){if(u)return _(),g.current=setTimeout(function(){return d(function(e){return e===h.length?i?1:e:e+1})},v),function(){_()}},[u,v,h.length,f,i]);var t=C.useCallback(function(e){switch(e.keyCode){case x.Keys.left:e.preventDefault(),(k?y:b)();break;case x.Keys.right:e.preventDefault(),(k?b:y)()}},[k,y,b]),e=C.useMemo(function(){return(0,x.classNames)("k-scrollview",{"k-scrollview-light":"light"===c,"k-scrollview-dark":"dark"===c},r)},[r,c]),a=C.Children.map(a||null,function(e,t){return C.createElement("div",{className:"k-scrollview-view","aria-hidden":f!==t+1},e)}),O=C.useCallback(function(){return(i||1<f)&&0<h.length},[f,h.length,i]),E=C.useCallback(function(){var e=f<h.length;return(i||e)&&0<h.length},[f,h.length,i]);return C.createElement("div",{className:e,style:n,ref:p,tabIndex:0,dir:s,onKeyDown:t},C.createElement("div",{className:"k-scrollview-wrap k-scrollview-animate",ref:m},a),C.createElement("div",{className:"k-scrollview-elements"},o&&C.createElement(C.Fragment,null,O()&&C.createElement("a",{className:"k-scrollview-prev","aria-label":"previous",onClick:b},C.createElement(x.IconWrap,{name:k?"chevron-right":"chevron-left",icon:k?P.chevronRightIcon:P.chevronLeftIcon,size:"xxxlarge"})),E()&&C.createElement("a",{className:"k-scrollview-next",onClick:y},C.createElement(x.IconWrap,{name:k?"chevron-left":"chevron-right",icon:k?P.chevronLeftIcon:P.chevronRightIcon,size:"xxxlarge"}))),l&&C.createElement("div",{className:"k-scrollview-nav-wrap"},C.createElement("ul",{className:"k-scrollview-nav"},h.map(function(e,t){return C.createElement("li",{className:(0,x.classNames)("k-link",{"k-primary":f===t+1}),key:t+1,onClick:function(){return d(t+1)}})})))))}),t.ScrollView.propTypes={activeView:n.number,arrows:n.bool,automaticViewChange:n.bool,automaticViewChangeInterval:n.number,children:n.any,className:n.string,dir:n.string,endless:n.bool,pageable:n.bool,pageOverlay:n.string,style:n.object},t.ScrollView.defaultProps={activeView:1,arrows:!0,automaticViewChange:!0,automaticViewChangeInterval:5e3,endless:!1,pageable:!0,pageOverlay:"none"},t.ScrollView.displayName="KendoScrollView"},271:(e,t)=>{Object.defineProperty(t,"__esModule",{value:!0})},468:function(e,t,r){var n=this&&this.__createBinding||(Object.create?function(e,t,r,n){void 0===n&&(n=r);var a=Object.getOwnPropertyDescriptor(t,r);a&&!("get"in a?!t.__esModule:a.writable||a.configurable)||(a={enumerable:!0,get:function(){return t[r]}}),Object.defineProperty(e,n,a)}:function(e,t,r,n){e[n=void 0===n?r:n]=t[r]}),a=this&&this.__exportStar||function(e,t){for(var r in e)"default"===r||Object.prototype.hasOwnProperty.call(t,r)||n(t,e,r)};Object.defineProperty(t,"__esModule",{value:!0}),a(r(850),t),a(r(271),t)},363:(e,t)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.packageMetadata=void 0,t.packageMetadata={name:"@progress/kendo-react-scrollview",productName:"KendoReact",productCodes:["KENDOUIREACT","KENDOUICOMPLETE"],publishDate:1684999481,version:"",licensingDocsUrl:"https://www.telerik.com/kendo-react-ui/my-license/?utm_medium=product&utm_source=kendoreact&utm_campaign=kendo-ui-react-purchase-license-keys-warning"}},811:e=>{e.exports=r},233:e=>{e.exports=c},895:e=>{e.exports=l},954:e=>{e.exports=o}},a={};return function e(t){var r=a[t];return void 0!==r||(r=a[t]={exports:{}},n[t].call(r.exports,r,r.exports,e)),r.exports}(468)})())}}});

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@progress/kendo-react-scrollview",
   "description": "React ScrollView (React Carousel) displays images or content in a horizontally scrollable collection. KendoReact ScrollView package",
-  "version": "5.14.0-dev.202305191608",
+  "version": "5.14.0-dev.202305250741",
   "repository": {
     "type": "git",
     "url": "https://github.com/telerik/kendo-react.git"
@@ -38,14 +38,14 @@
   "devDependencies": {
     "@progress/kendo-drawing": "^1.17.2",
     "@progress/kendo-licensing": "^1.3.0",
-    "@progress/kendo-react-animation": "5.14.0-dev.202305191608",
-    "@progress/kendo-react-buttons": "5.14.0-dev.202305191608",
-    "@progress/kendo-react-inputs": "5.14.0-dev.202305191608",
-    "@progress/kendo-react-intl": "5.14.0-dev.202305191608",
+    "@progress/kendo-react-animation": "5.14.0-dev.202305250741",
+    "@progress/kendo-react-buttons": "5.14.0-dev.202305250741",
+    "@progress/kendo-react-inputs": "5.14.0-dev.202305250741",
+    "@progress/kendo-react-intl": "5.14.0-dev.202305250741",
     "@progress/kendo-svg-icons": "^1.0.0"
   },
   "dependencies": {
-    "@progress/kendo-react-common": "5.14.0-dev.202305191608",
+    "@progress/kendo-react-common": "5.14.0-dev.202305250741",
     "prop-types": "^15.6.0"
   },
   "@progress": {