@progress/kendo-react-scrollview 9.5.0-develop.6 → 10.0.0-develop.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/ScrollView.js CHANGED
@@ -5,4 +5,4 @@
5
5
  * Licensed under commercial license. See LICENSE.md in the package root for more information
6
6
  *-------------------------------------------------------------------------------------------
7
7
  */
8
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const H=require("react"),l=require("prop-types"),s=require("@progress/kendo-react-common"),W=require("./package-metadata.js"),b=require("@progress/kendo-svg-icons"),$=require("@progress/kendo-react-intl"),f=require("./messages.js");function F(c){const w=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(c){for(const u in c)if(u!=="default"){const p=Object.getOwnPropertyDescriptor(c,u);Object.defineProperty(w,u,p.get?p:{enumerable:!0,get:()=>c[u]})}}return w.default=c,Object.freeze(w)}const e=F(H),N=e.forwardRef((c,w)=>{s.validatePackage(W.packageMetadata);const{className:u,style:p,children:R,pagerOverlay:y=v.pageOverlay,pageable:T=v.pageable,arrows:q=v.arrows,endless:r=v.endless,activeView:j=v.activeView,automaticViewChange:V=v.automaticViewChange,automaticViewChangeInterval:S=v.automaticViewChangeInterval}=c,[a,o]=e.useState(j||1),m=e.useRef(null),k=e.useRef(null),C=e.useRef(null),n=e.Children.toArray(R),E=s.useRtl(m,c.dir),g=E==="rtl",L=$.useLocalization(),x=e.useCallback(()=>{m.current&&m.current.focus()},[]),z=e.useCallback(()=>({element:m.current,focus:x}),[x]);e.useImperativeHandle(w,z);const d=e.useCallback(()=>{r?a>1?o(a-1):o(n.length):a>1&&o(a-1)},[a,n.length,r]),h=e.useCallback(()=>{r?a<n.length?o(a+1):o(1):a<n.length&&o(a+1)},[a,n.length,r]),D=e.useCallback(t=>{var P,K;const i=t.target;i.classList.contains("k-scrollview-prev")?(d(),!((r||a>2)&&n.length>0)&&((P=m.current)==null||P.focus())):i.classList.contains("k-scrollview-next")&&(h(),!((r||a<n.length-1)&&n.length>0)&&((K=m.current)==null||K.focus()))},[a,n.length,r]);e.useEffect(()=>{const t=n.length;k.current&&(k.current.style.setProperty("--kendo-scrollview-views",`${t}`),k.current.style.setProperty("--kendo-scrollview-current",`${a}`))},[n,a,E]);function O(){C.current&&clearTimeout(C.current)}e.useEffect(()=>{if(V)return O(),C.current=setTimeout(()=>o(t=>t===n.length?r?1:t:t+1),S),()=>{O()}},[V,S,n.length,a,r]);const I=e.useCallback(t=>{switch(t.key){case s.KEYS.left:t.preventDefault(),g?h():d();break;case s.KEYS.right:t.preventDefault(),g?d():h();break;case s.KEYS.space:t.preventDefault(),D(t);break;case s.KEYS.enter:t.preventDefault(),D(t);break}},[g,h,d]),A=e.useMemo(()=>s.classNames("k-scrollview",{"k-scrollview-light":y==="light","k-scrollview-dark":y==="dark"},u),[u,y]),M=e.Children.map(R||null,(t,i)=>e.createElement("div",{className:"k-scrollview-view","aria-hidden":a!==i+1},t)),Y=e.useCallback(()=>{let t;return t=a>1,(r||t)&&n.length>0},[a,n.length,r]),_=e.useCallback(()=>{let t;return t=a<n.length,(r||t)&&n.length>0},[a,n.length,r]);return e.createElement("div",{className:A,style:p,ref:m,tabIndex:0,dir:E,onKeyDown:I},e.createElement("div",{className:"k-scrollview-wrap k-scrollview-animate",ref:k},M),e.createElement("div",{className:"k-scrollview-elements"},q&&e.createElement(e.Fragment,null,Y()&&e.createElement("span",{className:"k-scrollview-prev","aria-label":L.toLanguageString(f.next,f.messages[f.next]),role:"button",tabIndex:0,onClick:d,onKeyDown:I},e.createElement(s.IconWrap,{name:g?"chevron-right":"chevron-left",icon:g?b.chevronRightIcon:b.chevronLeftIcon,size:"xxxlarge"})),_()&&e.createElement("span",{className:"k-scrollview-next","aria-label":L.toLanguageString(f.previous,f.messages[f.previous]),role:"button",tabIndex:0,onClick:h,onKeyDown:I},e.createElement(s.IconWrap,{name:g?"chevron-left":"chevron-right",icon:g?b.chevronLeftIcon:b.chevronRightIcon,size:"xxxlarge"}))),T&&e.createElement("div",{className:"k-scrollview-nav-wrap"},e.createElement("div",{className:"k-scrollview-nav"},n.map((t,i)=>e.createElement("span",{className:s.classNames("k-link",{"k-primary":a===i+1}),key:i+1,onClick:()=>o(i+1)}))))),e.createElement("div",{"aria-live":"polite","aria-atomic":"true",className:"k-sr-only"}))});N.propTypes={activeView:l.number,arrows:l.bool,automaticViewChange:l.bool,automaticViewChangeInterval:l.number,children:l.any,className:l.string,dir:l.string,endless:l.bool,pageable:l.bool,pageOverlay:l.string,style:l.object};const v={activeView:1,arrows:!0,automaticViewChange:!0,automaticViewChangeInterval:5e3,endless:!1,pageable:!0,pageOverlay:"none"};N.displayName="KendoScrollView";exports.ScrollView=N;
8
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const H=require("react"),l=require("prop-types"),s=require("@progress/kendo-react-common"),$=require("./package-metadata.js"),b=require("@progress/kendo-svg-icons"),F=require("@progress/kendo-react-intl"),f=require("./messages.js");function G(c){const w=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(c){for(const v in c)if(v!=="default"){const h=Object.getOwnPropertyDescriptor(c,v);Object.defineProperty(w,v,h.get?h:{enumerable:!0,get:()=>c[v]})}}return w.default=c,Object.freeze(w)}const e=G(H),N=e.forwardRef((c,w)=>{const v=!s.validatePackage($.packageMetadata,{component:"ScrollView"}),{className:h,style:T,children:V,pagerOverlay:y=g.pageOverlay,pageable:q=g.pageable,arrows:j=g.arrows,endless:n=g.endless,activeView:z=g.activeView,automaticViewChange:R=g.automaticViewChange,automaticViewChangeInterval:S=g.automaticViewChangeInterval}=c,[a,o]=e.useState(z||1),u=e.useRef(null),k=e.useRef(null),C=e.useRef(null),r=e.Children.toArray(V),E=s.useRtl(u,c.dir),m=E==="rtl",L=F.useLocalization(),O=e.useCallback(()=>{u.current&&u.current.focus()},[]),A=e.useCallback(()=>({element:u.current,focus:O}),[O]);e.useImperativeHandle(w,A);const d=e.useCallback(()=>{n?a>1?o(a-1):o(r.length):a>1&&o(a-1)},[a,r.length,n]),p=e.useCallback(()=>{n?a<r.length?o(a+1):o(1):a<r.length&&o(a+1)},[a,r.length,n]),x=e.useCallback(t=>{var P,K;const i=t.target;i.classList.contains("k-scrollview-prev")?(d(),!((n||a>2)&&r.length>0)&&((P=u.current)==null||P.focus())):i.classList.contains("k-scrollview-next")&&(p(),!((n||a<r.length-1)&&r.length>0)&&((K=u.current)==null||K.focus()))},[a,r.length,n]);e.useEffect(()=>{const t=r.length;k.current&&(k.current.style.setProperty("--kendo-scrollview-views",`${t}`),k.current.style.setProperty("--kendo-scrollview-current",`${a}`))},[r,a,E]);function D(){C.current&&clearTimeout(C.current)}e.useEffect(()=>{if(R)return D(),C.current=setTimeout(()=>o(t=>t===r.length?n?1:t:t+1),S),()=>{D()}},[R,S,r.length,a,n]);const I=e.useCallback(t=>{switch(t.key){case s.KEYS.left:t.preventDefault(),m?p():d();break;case s.KEYS.right:t.preventDefault(),m?d():p();break;case s.KEYS.space:t.preventDefault(),x(t);break;case s.KEYS.enter:t.preventDefault(),x(t);break}},[m,p,d]),M=e.useMemo(()=>s.classNames("k-scrollview",{"k-scrollview-light":y==="light","k-scrollview-dark":y==="dark"},h),[h,y]),W=e.Children.map(V||null,(t,i)=>e.createElement("div",{className:"k-scrollview-view","aria-hidden":a!==i+1},t)),Y=e.useCallback(()=>{let t;return t=a>1,(n||t)&&r.length>0},[a,r.length,n]),_=e.useCallback(()=>{let t;return t=a<r.length,(n||t)&&r.length>0},[a,r.length,n]);return e.createElement("div",{className:M,style:T,ref:u,tabIndex:0,dir:E,onKeyDown:I},e.createElement("div",{className:"k-scrollview-wrap k-scrollview-animate",ref:k},W),e.createElement("div",{className:"k-scrollview-elements"},j&&e.createElement(e.Fragment,null,Y()&&e.createElement("span",{className:"k-scrollview-prev","aria-label":L.toLanguageString(f.next,f.messages[f.next]),role:"button",tabIndex:0,onClick:d,onKeyDown:I},e.createElement(s.IconWrap,{name:m?"chevron-right":"chevron-left",icon:m?b.chevronRightIcon:b.chevronLeftIcon,size:"xxxlarge"})),_()&&e.createElement("span",{className:"k-scrollview-next","aria-label":L.toLanguageString(f.previous,f.messages[f.previous]),role:"button",tabIndex:0,onClick:p,onKeyDown:I},e.createElement(s.IconWrap,{name:m?"chevron-left":"chevron-right",icon:m?b.chevronLeftIcon:b.chevronRightIcon,size:"xxxlarge"}))),q&&e.createElement("div",{className:"k-scrollview-nav-wrap"},e.createElement("div",{className:"k-scrollview-nav"},r.map((t,i)=>e.createElement("span",{className:s.classNames("k-link",{"k-primary":a===i+1}),key:i+1,onClick:()=>o(i+1)}))))),e.createElement("div",{"aria-live":"polite","aria-atomic":"true",className:"k-sr-only"}),v&&e.createElement(s.WatermarkOverlay,null))});N.propTypes={activeView:l.number,arrows:l.bool,automaticViewChange:l.bool,automaticViewChangeInterval:l.number,children:l.any,className:l.string,dir:l.string,endless:l.bool,pageable:l.bool,pageOverlay:l.string,style:l.object};const g={activeView:1,arrows:!0,automaticViewChange:!0,automaticViewChangeInterval:5e3,endless:!1,pageable:!0,pageOverlay:"none"};N.displayName="KendoScrollView";exports.ScrollView=N;
package/ScrollView.mjs CHANGED
@@ -7,25 +7,24 @@
7
7
  */
8
8
  import * as e from "react";
9
9
  import n from "prop-types";
10
- import { validatePackage as J, useRtl as Q, KEYS as f, classNames as D, IconWrap as P } from "@progress/kendo-react-common";
11
- import { packageMetadata as U } from "./package-metadata.mjs";
12
- import { chevronRightIcon as K, chevronLeftIcon as S } from "@progress/kendo-svg-icons";
13
- import { useLocalization as X } from "@progress/kendo-react-intl";
14
- import { next as T, messages as A, previous as z } from "./messages.mjs";
15
- const O = e.forwardRef((d, B) => {
16
- J(U);
17
- const {
10
+ import { validatePackage as Q, useRtl as U, KEYS as w, classNames as D, IconWrap as P, WatermarkOverlay as X } from "@progress/kendo-react-common";
11
+ import { packageMetadata as Z } from "./package-metadata.mjs";
12
+ import { chevronRightIcon as S, chevronLeftIcon as K } from "@progress/kendo-svg-icons";
13
+ import { useLocalization as ee } from "@progress/kendo-react-intl";
14
+ import { next as T, messages as A, previous as O } from "./messages.mjs";
15
+ const z = e.forwardRef((d, W) => {
16
+ const B = !Q(Z, { component: "ScrollView" }), {
18
17
  className: b,
19
18
  style: H,
20
19
  children: y,
21
- pagerOverlay: w = m.pageOverlay,
20
+ pagerOverlay: f = m.pageOverlay,
22
21
  pageable: M = m.pageable,
23
22
  arrows: $ = m.arrows,
24
23
  endless: r = m.endless,
25
24
  activeView: j = m.activeView,
26
25
  automaticViewChange: C = m.automaticViewChange,
27
26
  automaticViewChangeInterval: E = m.automaticViewChangeInterval
28
- } = d, [a, s] = e.useState(j || 1), c = e.useRef(null), v = e.useRef(null), h = e.useRef(null), l = e.Children.toArray(y), p = Q(c, d.dir), i = p === "rtl", N = X(), I = e.useCallback(() => {
27
+ } = d, [a, s] = e.useState(j || 1), c = e.useRef(null), v = e.useRef(null), h = e.useRef(null), l = e.Children.toArray(y), p = U(c, d.dir), i = p === "rtl", N = ee(), I = e.useCallback(() => {
29
28
  c.current && c.current.focus();
30
29
  }, []), F = e.useCallback(
31
30
  () => ({
@@ -34,16 +33,16 @@ const O = e.forwardRef((d, B) => {
34
33
  }),
35
34
  [I]
36
35
  );
37
- e.useImperativeHandle(B, F);
36
+ e.useImperativeHandle(W, F);
38
37
  const u = e.useCallback(() => {
39
38
  r ? a > 1 ? s(a - 1) : s(l.length) : a > 1 && s(a - 1);
40
39
  }, [a, l.length, r]), g = e.useCallback(() => {
41
40
  r ? a < l.length ? s(a + 1) : s(1) : a < l.length && s(a + 1);
42
41
  }, [a, l.length, r]), V = e.useCallback(
43
42
  (t) => {
44
- var L, x;
43
+ var R, x;
45
44
  const o = t.target;
46
- o.classList.contains("k-scrollview-prev") ? (u(), !((r || a > 2) && l.length > 0) && ((L = c.current) == null || L.focus())) : o.classList.contains("k-scrollview-next") && (g(), !((r || a < l.length - 1) && l.length > 0) && ((x = c.current) == null || x.focus()));
45
+ o.classList.contains("k-scrollview-prev") ? (u(), !((r || a > 2) && l.length > 0) && ((R = c.current) == null || R.focus())) : o.classList.contains("k-scrollview-next") && (g(), !((r || a < l.length - 1) && l.length > 0) && ((x = c.current) == null || x.focus()));
47
46
  },
48
47
  [a, l.length, r]
49
48
  );
@@ -51,65 +50,65 @@ const O = e.forwardRef((d, B) => {
51
50
  const t = l.length;
52
51
  v.current && (v.current.style.setProperty("--kendo-scrollview-views", `${t}`), v.current.style.setProperty("--kendo-scrollview-current", `${a}`));
53
52
  }, [l, a, p]);
54
- function R() {
53
+ function L() {
55
54
  h.current && clearTimeout(h.current);
56
55
  }
57
56
  e.useEffect(() => {
58
57
  if (C)
59
- return R(), h.current = setTimeout(
58
+ return L(), h.current = setTimeout(
60
59
  () => s((t) => t === l.length ? r ? 1 : t : t + 1),
61
60
  E
62
61
  ), () => {
63
- R();
62
+ L();
64
63
  };
65
64
  }, [C, E, l.length, a, r]);
66
65
  const k = e.useCallback(
67
66
  (t) => {
68
67
  switch (t.key) {
69
- case f.left:
68
+ case w.left:
70
69
  t.preventDefault(), i ? g() : u();
71
70
  break;
72
- case f.right:
71
+ case w.right:
73
72
  t.preventDefault(), i ? u() : g();
74
73
  break;
75
- case f.space:
74
+ case w.space:
76
75
  t.preventDefault(), V(t);
77
76
  break;
78
- case f.enter:
77
+ case w.enter:
79
78
  t.preventDefault(), V(t);
80
79
  break;
81
80
  }
82
81
  },
83
82
  [i, g, u]
84
- ), W = e.useMemo(
83
+ ), Y = e.useMemo(
85
84
  () => D(
86
85
  "k-scrollview",
87
86
  {
88
- "k-scrollview-light": w === "light",
89
- "k-scrollview-dark": w === "dark"
87
+ "k-scrollview-light": f === "light",
88
+ "k-scrollview-dark": f === "dark"
90
89
  },
91
90
  b
92
91
  ),
93
- [b, w]
94
- ), Y = e.Children.map(y || null, (t, o) => /* @__PURE__ */ e.createElement("div", { className: "k-scrollview-view", "aria-hidden": a !== o + 1 }, t)), _ = e.useCallback(() => {
92
+ [b, f]
93
+ ), _ = e.Children.map(y || null, (t, o) => /* @__PURE__ */ e.createElement("div", { className: "k-scrollview-view", "aria-hidden": a !== o + 1 }, t)), q = e.useCallback(() => {
95
94
  let t;
96
95
  return t = a > 1, (r || t) && l.length > 0;
97
- }, [a, l.length, r]), q = e.useCallback(() => {
96
+ }, [a, l.length, r]), G = e.useCallback(() => {
98
97
  let t;
99
98
  return t = a < l.length, (r || t) && l.length > 0;
100
99
  }, [a, l.length, r]);
101
100
  return /* @__PURE__ */ e.createElement(
102
101
  "div",
103
102
  {
104
- className: W,
103
+ className: Y,
105
104
  style: H,
106
105
  ref: c,
107
106
  tabIndex: 0,
108
107
  dir: p,
109
108
  onKeyDown: k
110
109
  },
111
- /* @__PURE__ */ e.createElement("div", { className: "k-scrollview-wrap k-scrollview-animate", ref: v }, Y),
112
- /* @__PURE__ */ e.createElement("div", { className: "k-scrollview-elements" }, $ && /* @__PURE__ */ e.createElement(e.Fragment, null, _() && /* @__PURE__ */ e.createElement(
110
+ /* @__PURE__ */ e.createElement("div", { className: "k-scrollview-wrap k-scrollview-animate", ref: v }, _),
111
+ /* @__PURE__ */ e.createElement("div", { className: "k-scrollview-elements" }, $ && /* @__PURE__ */ e.createElement(e.Fragment, null, q() && /* @__PURE__ */ e.createElement(
113
112
  "span",
114
113
  {
115
114
  className: "k-scrollview-prev",
@@ -123,15 +122,15 @@ const O = e.forwardRef((d, B) => {
123
122
  P,
124
123
  {
125
124
  name: i ? "chevron-right" : "chevron-left",
126
- icon: i ? K : S,
125
+ icon: i ? S : K,
127
126
  size: "xxxlarge"
128
127
  }
129
128
  )
130
- ), q() && /* @__PURE__ */ e.createElement(
129
+ ), G() && /* @__PURE__ */ e.createElement(
131
130
  "span",
132
131
  {
133
132
  className: "k-scrollview-next",
134
- "aria-label": N.toLanguageString(z, A[z]),
133
+ "aria-label": N.toLanguageString(O, A[O]),
135
134
  role: "button",
136
135
  tabIndex: 0,
137
136
  onClick: g,
@@ -141,7 +140,7 @@ const O = e.forwardRef((d, B) => {
141
140
  P,
142
141
  {
143
142
  name: i ? "chevron-left" : "chevron-right",
144
- icon: i ? S : K,
143
+ icon: i ? K : S,
145
144
  size: "xxxlarge"
146
145
  }
147
146
  )
@@ -155,10 +154,11 @@ const O = e.forwardRef((d, B) => {
155
154
  onClick: () => s(o + 1)
156
155
  }
157
156
  ))))),
158
- /* @__PURE__ */ e.createElement("div", { "aria-live": "polite", "aria-atomic": "true", className: "k-sr-only" })
157
+ /* @__PURE__ */ e.createElement("div", { "aria-live": "polite", "aria-atomic": "true", className: "k-sr-only" }),
158
+ B && /* @__PURE__ */ e.createElement(X, null)
159
159
  );
160
160
  });
161
- O.propTypes = {
161
+ z.propTypes = {
162
162
  activeView: n.number,
163
163
  arrows: n.bool,
164
164
  automaticViewChange: n.bool,
@@ -180,7 +180,7 @@ const m = {
180
180
  pageable: !0,
181
181
  pageOverlay: "none"
182
182
  };
183
- O.displayName = "KendoScrollView";
183
+ z.displayName = "KendoScrollView";
184
184
  export {
185
- O as ScrollView
185
+ z as ScrollView
186
186
  };
@@ -12,4 +12,4 @@
12
12
  * Licensed under commercial license. See LICENSE.md in the package root for more information
13
13
  *-------------------------------------------------------------------------------------------
14
14
  */
15
- !function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react"),require("prop-types"),require("@progress/kendo-react-common"),require("@progress/kendo-svg-icons"),require("@progress/kendo-react-intl")):"function"==typeof define&&define.amd?define(["exports","react","prop-types","@progress/kendo-react-common","@progress/kendo-svg-icons","@progress/kendo-react-intl"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).KendoReactScrollview={},e.React,e.PropTypes,e.KendoReactCommon,e.KendoSvgIcons,e.KendoReactIntl)}(this,(function(e,t,r,a,n,l){"use strict";function c(e){var t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var a=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,a.get?a:{enumerable:!0,get:function(){return e[r]}})}})),t.default=e,Object.freeze(t)}var o=c(t);const s={name:"@progress/kendo-react-scrollview",productName:"KendoReact",productCode:"KENDOUIREACT",productCodes:["KENDOUIREACT"],publishDate:0,version:"$VERSION",licensingDocsUrl:"https://www.telerik.com/kendo-react-ui/components/my-license/"},i="scrollview.previous",u="scrollview.next",g={[i]:"Previous",[u]:"Next"},v=o.forwardRef(((e,t)=>{a.validatePackage(s);const{className:r,style:c,children:v,pagerOverlay:p=m.pageOverlay,pageable:d=m.pageable,arrows:h=m.arrows,endless:w=m.endless,activeView:f=m.activeView,automaticViewChange:k=m.automaticViewChange,automaticViewChangeInterval:b=m.automaticViewChangeInterval}=e,[y,C]=o.useState(f||1),E=o.useRef(null),N=o.useRef(null),I=o.useRef(null),x=o.Children.toArray(v),K=a.useRtl(E,e.dir),R="rtl"===K,V=l.useLocalization(),O=o.useCallback((()=>{E.current&&E.current.focus()}),[]),S=o.useCallback((()=>({element:E.current,focus:O})),[O]);o.useImperativeHandle(t,S);const D=o.useCallback((()=>{w?C(y>1?y-1:x.length):y>1&&C(y-1)}),[y,x.length,w]),T=o.useCallback((()=>{w?y<x.length?C(y+1):C(1):y<x.length&&C(y+1)}),[y,x.length,w]),j=o.useCallback((e=>{var t,r;const a=e.target;a.classList.contains("k-scrollview-prev")?(D(),!((w||y>2)&&x.length>0)&&(null==(t=E.current)||t.focus())):a.classList.contains("k-scrollview-next")&&(T(),!((w||y<x.length-1)&&x.length>0)&&(null==(r=E.current)||r.focus()))}),[y,x.length,w]);function L(){I.current&&clearTimeout(I.current)}o.useEffect((()=>{const e=x.length;N.current&&(N.current.style.setProperty("--kendo-scrollview-views",`${e}`),N.current.style.setProperty("--kendo-scrollview-current",`${y}`))}),[x,y,K]),o.useEffect((()=>{if(k)return L(),I.current=setTimeout((()=>C((e=>e===x.length?w?1:e:e+1))),b),()=>{L()}}),[k,b,x.length,y,w]);const P=o.useCallback((e=>{switch(e.key){case a.KEYS.left:e.preventDefault(),R?T():D();break;case a.KEYS.right:e.preventDefault(),R?D():T();break;case a.KEYS.space:case a.KEYS.enter:e.preventDefault(),j(e)}}),[R,T,D]),q=o.useMemo((()=>a.classNames("k-scrollview",{"k-scrollview-light":"light"===p,"k-scrollview-dark":"dark"===p},r)),[r,p]),z=o.Children.map(v||null,((e,t)=>o.createElement("div",{className:"k-scrollview-view","aria-hidden":y!==t+1},e))),Y=o.useCallback((()=>{let e;return e=y>1,(w||e)&&x.length>0}),[y,x.length,w]),A=o.useCallback((()=>{let e;return e=y<x.length,(w||e)&&x.length>0}),[y,x.length,w]);return o.createElement("div",{className:q,style:c,ref:E,tabIndex:0,dir:K,onKeyDown:P},o.createElement("div",{className:"k-scrollview-wrap k-scrollview-animate",ref:N},z),o.createElement("div",{className:"k-scrollview-elements"},h&&o.createElement(o.Fragment,null,Y()&&o.createElement("span",{className:"k-scrollview-prev","aria-label":V.toLanguageString(u,g[u]),role:"button",tabIndex:0,onClick:D,onKeyDown:P},o.createElement(a.IconWrap,{name:R?"chevron-right":"chevron-left",icon:R?n.chevronRightIcon:n.chevronLeftIcon,size:"xxxlarge"})),A()&&o.createElement("span",{className:"k-scrollview-next","aria-label":V.toLanguageString(i,g[i]),role:"button",tabIndex:0,onClick:T,onKeyDown:P},o.createElement(a.IconWrap,{name:R?"chevron-left":"chevron-right",icon:R?n.chevronLeftIcon:n.chevronRightIcon,size:"xxxlarge"}))),d&&o.createElement("div",{className:"k-scrollview-nav-wrap"},o.createElement("div",{className:"k-scrollview-nav"},x.map(((e,t)=>o.createElement("span",{className:a.classNames("k-link",{"k-primary":y===t+1}),key:t+1,onClick:()=>C(t+1)})))))),o.createElement("div",{"aria-live":"polite","aria-atomic":"true",className:"k-sr-only"}))}));v.propTypes={activeView:r.number,arrows:r.bool,automaticViewChange:r.bool,automaticViewChangeInterval:r.number,children:r.any,className:r.string,dir:r.string,endless:r.bool,pageable:r.bool,pageOverlay:r.string,style:r.object};const m={activeView:1,arrows:!0,automaticViewChange:!0,automaticViewChangeInterval:5e3,endless:!1,pageable:!0,pageOverlay:"none"};v.displayName="KendoScrollView",e.ScrollView=v}));
15
+ !function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react"),require("prop-types"),require("@progress/kendo-react-common"),require("@progress/kendo-svg-icons"),require("@progress/kendo-react-intl")):"function"==typeof define&&define.amd?define(["exports","react","prop-types","@progress/kendo-react-common","@progress/kendo-svg-icons","@progress/kendo-react-intl"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).KendoReactScrollview={},e.React,e.PropTypes,e.KendoReactCommon,e.KendoSvgIcons,e.KendoReactIntl)}(this,(function(e,t,r,a,n,l){"use strict";function c(e){var t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var a=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,a.get?a:{enumerable:!0,get:function(){return e[r]}})}})),t.default=e,Object.freeze(t)}var o=c(t);const s={name:"@progress/kendo-react-scrollview",productName:"KendoReact",productCode:"KENDOUIREACT",productCodes:["KENDOUIREACT"],publishDate:0,version:"$VERSION",licensingDocsUrl:"https://www.telerik.com/kendo-react-ui/components/my-license/"},i="scrollview.previous",u="scrollview.next",g={[i]:"Previous",[u]:"Next"},m=o.forwardRef(((e,t)=>{const r=!a.validatePackage(s,{component:"ScrollView"}),{className:c,style:m,children:p,pagerOverlay:d=v.pageOverlay,pageable:h=v.pageable,arrows:w=v.arrows,endless:k=v.endless,activeView:f=v.activeView,automaticViewChange:b=v.automaticViewChange,automaticViewChangeInterval:y=v.automaticViewChangeInterval}=e,[C,E]=o.useState(f||1),N=o.useRef(null),I=o.useRef(null),x=o.useRef(null),V=o.Children.toArray(p),K=a.useRtl(N,e.dir),R="rtl"===K,O=l.useLocalization(),S=o.useCallback((()=>{N.current&&N.current.focus()}),[]),D=o.useCallback((()=>({element:N.current,focus:S})),[S]);o.useImperativeHandle(t,D);const T=o.useCallback((()=>{k?E(C>1?C-1:V.length):C>1&&E(C-1)}),[C,V.length,k]),j=o.useCallback((()=>{k?C<V.length?E(C+1):E(1):C<V.length&&E(C+1)}),[C,V.length,k]),L=o.useCallback((e=>{var t,r;const a=e.target;a.classList.contains("k-scrollview-prev")?(T(),!((k||C>2)&&V.length>0)&&(null==(t=N.current)||t.focus())):a.classList.contains("k-scrollview-next")&&(j(),!((k||C<V.length-1)&&V.length>0)&&(null==(r=N.current)||r.focus()))}),[C,V.length,k]);function P(){x.current&&clearTimeout(x.current)}o.useEffect((()=>{const e=V.length;I.current&&(I.current.style.setProperty("--kendo-scrollview-views",`${e}`),I.current.style.setProperty("--kendo-scrollview-current",`${C}`))}),[V,C,K]),o.useEffect((()=>{if(b)return P(),x.current=setTimeout((()=>E((e=>e===V.length?k?1:e:e+1))),y),()=>{P()}}),[b,y,V.length,C,k]);const q=o.useCallback((e=>{switch(e.key){case a.KEYS.left:e.preventDefault(),R?j():T();break;case a.KEYS.right:e.preventDefault(),R?T():j();break;case a.KEYS.space:case a.KEYS.enter:e.preventDefault(),L(e)}}),[R,j,T]),z=o.useMemo((()=>a.classNames("k-scrollview",{"k-scrollview-light":"light"===d,"k-scrollview-dark":"dark"===d},c)),[c,d]),Y=o.Children.map(p||null,((e,t)=>o.createElement("div",{className:"k-scrollview-view","aria-hidden":C!==t+1},e))),A=o.useCallback((()=>{let e;return e=C>1,(k||e)&&V.length>0}),[C,V.length,k]),U=o.useCallback((()=>{let e;return e=C<V.length,(k||e)&&V.length>0}),[C,V.length,k]);return o.createElement("div",{className:z,style:m,ref:N,tabIndex:0,dir:K,onKeyDown:q},o.createElement("div",{className:"k-scrollview-wrap k-scrollview-animate",ref:I},Y),o.createElement("div",{className:"k-scrollview-elements"},w&&o.createElement(o.Fragment,null,A()&&o.createElement("span",{className:"k-scrollview-prev","aria-label":O.toLanguageString(u,g[u]),role:"button",tabIndex:0,onClick:T,onKeyDown:q},o.createElement(a.IconWrap,{name:R?"chevron-right":"chevron-left",icon:R?n.chevronRightIcon:n.chevronLeftIcon,size:"xxxlarge"})),U()&&o.createElement("span",{className:"k-scrollview-next","aria-label":O.toLanguageString(i,g[i]),role:"button",tabIndex:0,onClick:j,onKeyDown:q},o.createElement(a.IconWrap,{name:R?"chevron-left":"chevron-right",icon:R?n.chevronLeftIcon:n.chevronRightIcon,size:"xxxlarge"}))),h&&o.createElement("div",{className:"k-scrollview-nav-wrap"},o.createElement("div",{className:"k-scrollview-nav"},V.map(((e,t)=>o.createElement("span",{className:a.classNames("k-link",{"k-primary":C===t+1}),key:t+1,onClick:()=>E(t+1)})))))),o.createElement("div",{"aria-live":"polite","aria-atomic":"true",className:"k-sr-only"}),r&&o.createElement(a.WatermarkOverlay,null))}));m.propTypes={activeView:r.number,arrows:r.bool,automaticViewChange:r.bool,automaticViewChangeInterval:r.number,children:r.any,className:r.string,dir:r.string,endless:r.bool,pageable:r.bool,pageOverlay:r.string,style:r.object};const v={activeView:1,arrows:!0,automaticViewChange:!0,automaticViewChangeInterval:5e3,endless:!1,pageable:!0,pageOverlay:"none"};m.displayName="KendoScrollView",e.ScrollView=m}));
@@ -5,4 +5,4 @@
5
5
  * Licensed under commercial license. See LICENSE.md in the package root for more information
6
6
  *-------------------------------------------------------------------------------------------
7
7
  */
8
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e={name:"@progress/kendo-react-scrollview",productName:"KendoReact",productCode:"KENDOUIREACT",productCodes:["KENDOUIREACT"],publishDate: 1741088102,version:"9.5.0-develop.6",licensingDocsUrl:"https://www.telerik.com/kendo-react-ui/components/my-license/"};exports.packageMetadata=e;
8
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e={name:"@progress/kendo-react-scrollview",productName:"KendoReact",productCode:"KENDOUIREACT",productCodes:["KENDOUIREACT"],publishDate: 1741180829,version:"10.0.0-develop.1",licensingDocsUrl:"https://www.telerik.com/kendo-react-ui/components/my-license/"};exports.packageMetadata=e;
@@ -10,8 +10,8 @@ const e = {
10
10
  productName: "KendoReact",
11
11
  productCode: "KENDOUIREACT",
12
12
  productCodes: ["KENDOUIREACT"],
13
- publishDate: 1741088102,
14
- version: "9.5.0-develop.6",
13
+ publishDate: 1741180829,
14
+ version: "10.0.0-develop.1",
15
15
  licensingDocsUrl: "https://www.telerik.com/kendo-react-ui/components/my-license/"
16
16
  };
17
17
  export {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@progress/kendo-react-scrollview",
3
- "version": "9.5.0-develop.6",
3
+ "version": "10.0.0-develop.1",
4
4
  "description": "React ScrollView (React Carousel) displays images or content in a horizontally scrollable collection. KendoReact ScrollView package",
5
5
  "author": "Progress",
6
6
  "license": "SEE LICENSE IN LICENSE.md",
@@ -26,7 +26,7 @@
26
26
  "sideEffects": false,
27
27
  "peerDependencies": {
28
28
  "@progress/kendo-licensing": "^1.5.0",
29
- "@progress/kendo-react-common": "9.5.0-develop.6",
29
+ "@progress/kendo-react-common": "10.0.0-develop.1",
30
30
  "@progress/kendo-svg-icons": "^4.0.0",
31
31
  "react": "^16.8.2 || ^17.0.0 || ^18.0.0 || ^19.0.0 || ^19.0.0-rc",
32
32
  "react-dom": "^16.8.2 || ^17.0.0 || ^18.0.0 || ^19.0.0 || ^19.0.0-rc"
@@ -52,7 +52,7 @@
52
52
  "package": {
53
53
  "productName": "KendoReact",
54
54
  "productCode": "KENDOUIREACT",
55
- "publishDate": 1741088102,
55
+ "publishDate": 1741180829,
56
56
  "licensingDocsUrl": "https://www.telerik.com/kendo-react-ui/components/my-license/"
57
57
  }
58
58
  },