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