@progress/kendo-vue-scrollview 8.0.3-develop.2 → 8.0.3-develop.4

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.
Files changed (9) hide show
  1. package/ScrollView.d.ts +162 -0
  2. package/ScrollViewProps.d.ts +61 -0
  3. package/dist/cdn/js/kendo-vue-scrollview.js +1 -1
  4. package/index.d.mts +2 -217
  5. package/index.d.ts +2 -217
  6. package/package-metadata.d.ts +12 -0
  7. package/package-metadata.js +1 -1
  8. package/package-metadata.mjs +2 -2
  9. package/package.json +11 -5
package/ScrollView.d.ts ADDED
@@ -0,0 +1,162 @@
1
+ /**
2
+ * @license
3
+ *-------------------------------------------------------------------------------------------
4
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
5
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
6
+ *-------------------------------------------------------------------------------------------
7
+ */
8
+ import { PropType } from 'vue';
9
+ /**
10
+ *
11
+ * Represents the [Kendo UI for Vue Native ScrollView component]({% slug overview_scrollview %}).
12
+ *
13
+ * ```jsx
14
+ * <template>
15
+ * <div>
16
+ * <ScrollView
17
+ * :style="{
18
+ * width: '512px',
19
+ * height: '384px',
20
+ * }"
21
+ * :data-items="items"
22
+ * :content="'content'"
23
+ * >
24
+ * <template v-slot:content="{ props }">
25
+ * <div class="image-with-text">
26
+ * <img
27
+ * :src="props.item.url"
28
+ * :alt="`Photo ${props.item.position}`"
29
+ * :style="{
30
+ * width: '512px',
31
+ * height: '384px',
32
+ * }"
33
+ * :draggable="false"
34
+ * />
35
+ * </div>
36
+ * </template>
37
+ * </ScrollView>
38
+ * </div>
39
+ * </template>
40
+ *
41
+ * <script>
42
+ * import { ScrollView } from '@progress/kendo-vue-scrollview';
43
+ *
44
+ * export default {
45
+ * components: {
46
+ * ScrollView,
47
+ * },
48
+ * data() {
49
+ * return {
50
+ * items: [
51
+ * {
52
+ * url: 'https://www.telerik.com/kendo-vue-ui/components/layout/assets/card/kukeri.jpg',
53
+ * },
54
+ * {
55
+ * url: 'https://www.telerik.com/kendo-vue-ui/components/layout/assets/card/martenitsa.jpg',
56
+ * },
57
+ * {
58
+ * url: 'https://www.telerik.com/kendo-vue-ui/components/layout/assets/card/rose_festival.jpg',
59
+ * },
60
+ * ],
61
+ * };
62
+ * },
63
+ * };
64
+ * </script>
65
+ * ```
66
+ */
67
+ declare const ScrollView: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
68
+ activeView: {
69
+ type: PropType<number>;
70
+ default: number;
71
+ };
72
+ dataItems: {
73
+ type: PropType<any[]>;
74
+ default: () => any[];
75
+ };
76
+ arrows: {
77
+ type: PropType<boolean>;
78
+ default: boolean;
79
+ };
80
+ automaticViewChange: {
81
+ type: BooleanConstructor;
82
+ default: boolean;
83
+ };
84
+ automaticViewChangeInterval: {
85
+ type: PropType<number>;
86
+ default: number;
87
+ };
88
+ content: PropType<any>;
89
+ dir: PropType<string>;
90
+ endless: PropType<boolean>;
91
+ pageable: {
92
+ type: PropType<boolean>;
93
+ default: boolean;
94
+ };
95
+ pagerOverlay: {
96
+ type: PropType<string>;
97
+ default: string;
98
+ };
99
+ }>, {}, {
100
+ active: number;
101
+ currentDir: any;
102
+ }, {
103
+ scrollViewClasses(): {
104
+ 'k-scrollview': boolean;
105
+ 'k-scrollview-light': boolean;
106
+ 'k-scrollview-dark': boolean;
107
+ };
108
+ displayLeftArrow(): boolean;
109
+ displayRightArrow(): boolean;
110
+ isRtl(): boolean;
111
+ }, {
112
+ runAutomaticChange(): void;
113
+ resetTimeout(): void;
114
+ setActive(value: number): void;
115
+ focusElement(): void;
116
+ prev(): void;
117
+ next(): void;
118
+ handlePrevClick(): void;
119
+ handleNextClick(): void;
120
+ handleKeyDown(event: any): void;
121
+ }, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
122
+ activeView: {
123
+ type: PropType<number>;
124
+ default: number;
125
+ };
126
+ dataItems: {
127
+ type: PropType<any[]>;
128
+ default: () => any[];
129
+ };
130
+ arrows: {
131
+ type: PropType<boolean>;
132
+ default: boolean;
133
+ };
134
+ automaticViewChange: {
135
+ type: BooleanConstructor;
136
+ default: boolean;
137
+ };
138
+ automaticViewChangeInterval: {
139
+ type: PropType<number>;
140
+ default: number;
141
+ };
142
+ content: PropType<any>;
143
+ dir: PropType<string>;
144
+ endless: PropType<boolean>;
145
+ pageable: {
146
+ type: PropType<boolean>;
147
+ default: boolean;
148
+ };
149
+ pagerOverlay: {
150
+ type: PropType<string>;
151
+ default: string;
152
+ };
153
+ }>> & Readonly<{}>, {
154
+ activeView: number;
155
+ dataItems: any[];
156
+ arrows: boolean;
157
+ automaticViewChangeInterval: number;
158
+ pageable: boolean;
159
+ pagerOverlay: string;
160
+ automaticViewChange: boolean;
161
+ }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
162
+ export { ScrollView };
package/ScrollViewProps.d.ts ADDED
@@ -0,0 +1,61 @@
1
+ /**
2
+ * @license
3
+ *-------------------------------------------------------------------------------------------
4
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
5
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
6
+ *-------------------------------------------------------------------------------------------
7
+ */
8
+ /**
9
+ * Represents the props of the [Kendo UI for Vue ScrollView component]({% slug overview_scrollview %}).
10
+ */
11
+ export interface ScrollViewProps {
12
+ /**
13
+ * Represents the current active view ([see example]({% slug activeview_scrollview %})). Defaults to `1`.
14
+ */
15
+ activeView?: number;
16
+ /**
17
+ * Enables or disables the built-in navigation arrows ([see example]({% slug arrows_scrollview %})). Defaults to `true`.
18
+ */
19
+ arrows?: boolean;
20
+ /**
21
+ * Allows the ScrollView to switch the next page automatically after a short delay ([see example]({% slug automatic_scrolling_scrollview %})).
22
+ * Defaults to `true`.
23
+ */
24
+ automaticViewChange?: boolean;
25
+ /**
26
+ * Defines the automatic page change delay in milliseconds ([see example]({% slug automatic_scrolling_scrollview %})).
27
+ * Defaults to `5000`.
28
+ */
29
+ automaticViewChangeInterval?: number;
30
+ /**
31
+ * Content Template for the ScrollView items.
32
+ */
33
+ content?: any;
34
+ /**
35
+ * An array of the items that are passed to the ScrollView component.
36
+ */
37
+ dataItems?: any[];
38
+ /**
39
+ * Represents the `dir` HTML attribute. This is used to switch from LTR to RTL.
40
+ */
41
+ dir?: string;
42
+ /**
43
+ * Toggles the endless scrolling mode in which the data items are endlessly looped
44
+ * ([see example]({% slug endlessscrolling_scrollview %})). Defaults to `false`.
45
+ */
46
+ endless?: boolean;
47
+ /**
48
+ * Toggles the built-in pager ([see example]({% slug paging_scrollview %})). Defaults to `true`.
49
+ */
50
+ pageable?: boolean;
51
+ /**
52
+ * Sets the pager overlay ([see example]({% slug paging_scrollview %})).
53
+ *
54
+ * * The possible values are:
55
+ * * `none`(Default) &mdash; No overlay is set.
56
+ * * `dark` &mdash; Dark overlay is set.
57
+ * * `light` &mdash; Light overlay is set.
58
+ *
59
+ */
60
+ pagerOverlay?: 'dark' | 'light' | 'none' | string;
61
+ }
package/dist/cdn/js/kendo-vue-scrollview.js CHANGED
@@ -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("vue"),require("@progress/kendo-vue-common"),require("@progress/kendo-svg-icons")):"function"==typeof define&&define.amd?define(["exports","vue","@progress/kendo-vue-common","@progress/kendo-svg-icons"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).KendoVueScrollview={},e.Vue,e.KendoVueCommon,e.KendoSVGIcons)}(this,(function(e,t,i,s){"use strict";const a={name:"@progress/kendo-vue-scrollview",productName:"Kendo UI for Vue",productCode:"KENDOUIVUE",productCodes:["KENDOUIVUE"],publishDate:0,version:"8.0.3-develop.2",licensingDocsUrl:"https://www.telerik.com/kendo-vue-ui/my-license/"},r=t.defineComponent({name:"KendoScrollView",props:{activeView:{type:Number,default:1},dataItems:{type:Array,default:function(){return[]}},arrows:{type:Boolean,default:!0},automaticViewChange:{type:Boolean,default:!0},automaticViewChangeInterval:{type:Number,default:5e3},content:[Object,String,Function],dir:String,endless:Boolean,pageable:{type:Boolean,default:!0},pagerOverlay:{type:String,default:"none"}},created(){i.validatePackage(a),this.timeoutRef=null},mounted(){this.wrapElement=i.getRef(this,"wrapElement"),this.currentDir=void 0!==this.$props.dir?this.$props.dir:i.isRtl(this.$el)?"rtl":"ltr",this.runAutomaticChange()},updated(){const e=this.dataItems.length;this.wrapElement&&(this.wrapElement.style.setProperty("--kendo-scrollview-views",`${e}`),this.wrapElement.style.setProperty("--kendo-scrollview-current",`${this.active}`)),this.runAutomaticChange()},data(){return{active:this.activeView||1,currentDir:void 0}},computed:{scrollViewClasses(){return{"k-scrollview":!0,"k-scrollview-light":"light"===this.pagerOverlay,"k-scrollview-dark":"dark"===this.pagerOverlay}},displayLeftArrow(){let e;return e=this.isRtl?this.active<this.dataItems.length:this.active>1,(this.endless||e)&&this.dataItems.length>0},displayRightArrow(){let e;return e=this.isRtl?this.active>1:this.active<this.dataItems.length,(this.endless||e)&&this.dataItems.length>0},isRtl(){return"rtl"===this.currentDir}},render(){const{pageable:e,arrows:a,content:r}=this.$props,l=this.dataItems.length,n=this.dataItems.map((function(e,s){const a=i.templateRendering.call(this,e.content||r,i.getListeners.call(this)),l=i.getTemplate.call(this,{h:t.h,template:a,defaultRendering:null,additionalProps:{item:e,items:this.dataItems}});return t.createVNode("div",{class:"k-scrollview-view","aria-hidden":this.active!==s+1},[l])}),this);return t.createVNode("div",{class:this.scrollViewClasses,tabindex:0,dir:this.currentDir,onKeydown:this.handleKeyDown},[t.createVNode("div",{class:"k-scrollview-wrap k-scrollview-animate",style:`--kendo-scrollview-views:${l}; --kendo-scrollview-current:${this.active};`,ref:i.setRef(this,"wrapElement")},[n]),t.createVNode("div",{class:"k-scrollview-elements"},[a&&[this.displayLeftArrow&&t.createVNode("span",{class:"k-scrollview-prev","aria-label":"previous",onClick:this.handlePrevClick},[t.createVNode(i.Icon,{name:this.isRtl?"chevron-right":"chevron-left",icon:this.isRtl?s.chevronRightIcon:s.chevronLeftIcon,size:"xxxlarge"},null)]),this.displayRightArrow&&t.createVNode("span",{class:"k-scrollview-next","aria-label":"next",onClick:this.handleNextClick},[t.createVNode(i.Icon,{name:this.isRtl?"chevron-left":"chevron-right",icon:this.isRtl?s.chevronLeftIcon:s.chevronRightIcon,size:"xxxlarge"},null)])],e&&t.createVNode("div",{class:"k-scrollview-nav-wrap"},[t.createVNode("ul",{class:"k-scrollview-nav"},[this.dataItems.map((function(e,s){return t.createVNode("li",{class:i.classNames("k-link",{"k-primary":this.active===s+1}),key:s+1,onClick:()=>this.setActive(s+1)},null)}),this)])])])])},methods:{runAutomaticChange(){if(this.automaticViewChange){this.resetTimeout();const e=this,t=this.active;this.timeoutRef=setTimeout((function(){e.setActive(t===e.dataItems.length?e.endless?1:t:t+1)}),this.automaticViewChangeInterval)}},resetTimeout(){this.timeoutRef&&clearTimeout(this.timeoutRef)},setActive(e){this.active=e},focusElement(){this.$el&&this.$el.focus()},prev(){this.endless?this.active>1?this.setActive(this.active-1):this.setActive(this.dataItems.length):this.active>1&&this.setActive(this.active-1)},next(){this.endless?this.active<this.dataItems.length?this.setActive(this.active+1):this.setActive(1):this.active<this.dataItems.length&&this.setActive(this.active+1)},handlePrevClick(){this.isRtl?this.next():this.prev()},handleNextClick(){this.isRtl?this.prev():this.next()},handleKeyDown(e){switch(e.keyCode){case i.Keys.left:e.preventDefault(),this.isRtl?this.next():this.prev();break;case i.Keys.right:e.preventDefault(),this.isRtl?this.prev():this.next()}}}});e.ScrollView=r}));
15
+ !function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("vue"),require("@progress/kendo-vue-common"),require("@progress/kendo-svg-icons")):"function"==typeof define&&define.amd?define(["exports","vue","@progress/kendo-vue-common","@progress/kendo-svg-icons"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).KendoVueScrollview={},e.Vue,e.KendoVueCommon,e.KendoSVGIcons)}(this,function(e,t,i,s){"use strict";const a={name:"@progress/kendo-vue-scrollview",productName:"Kendo UI for Vue",productCode:"KENDOUIVUE",productCodes:["KENDOUIVUE"],publishDate:0,version:"8.0.3-develop.4",licensingDocsUrl:"https://www.telerik.com/kendo-vue-ui/my-license/"},r=t.defineComponent({name:"KendoScrollView",props:{activeView:{type:Number,default:1},dataItems:{type:Array,default:function(){return[]}},arrows:{type:Boolean,default:!0},automaticViewChange:{type:Boolean,default:!0},automaticViewChangeInterval:{type:Number,default:5e3},content:[Object,String,Function],dir:String,endless:Boolean,pageable:{type:Boolean,default:!0},pagerOverlay:{type:String,default:"none"}},created(){i.validatePackage(a),this.timeoutRef=null},mounted(){this.wrapElement=i.getRef(this,"wrapElement"),this.currentDir=void 0!==this.$props.dir?this.$props.dir:i.isRtl(this.$el)?"rtl":"ltr",this.runAutomaticChange()},updated(){const e=this.dataItems.length;this.wrapElement&&(this.wrapElement.style.setProperty("--kendo-scrollview-views",`${e}`),this.wrapElement.style.setProperty("--kendo-scrollview-current",`${this.active}`)),this.runAutomaticChange()},data(){return{active:this.activeView||1,currentDir:void 0}},computed:{scrollViewClasses(){return{"k-scrollview":!0,"k-scrollview-light":"light"===this.pagerOverlay,"k-scrollview-dark":"dark"===this.pagerOverlay}},displayLeftArrow(){let e;return e=this.isRtl?this.active<this.dataItems.length:this.active>1,(this.endless||e)&&this.dataItems.length>0},displayRightArrow(){let e;return e=this.isRtl?this.active>1:this.active<this.dataItems.length,(this.endless||e)&&this.dataItems.length>0},isRtl(){return"rtl"===this.currentDir}},render(){const{pageable:e,arrows:a,content:r}=this.$props,l=this.dataItems.length,n=this.dataItems.map(function(e,s){const a=i.templateRendering.call(this,e.content||r,i.getListeners.call(this)),l=i.getTemplate.call(this,{h:t.h,template:a,defaultRendering:null,additionalProps:{item:e,items:this.dataItems}});return t.createVNode("div",{class:"k-scrollview-view","aria-hidden":this.active!==s+1},[l])},this);return t.createVNode("div",{class:this.scrollViewClasses,tabindex:0,dir:this.currentDir,onKeydown:this.handleKeyDown},[t.createVNode("div",{class:"k-scrollview-wrap k-scrollview-animate",style:`--kendo-scrollview-views:${l}; --kendo-scrollview-current:${this.active};`,ref:i.setRef(this,"wrapElement")},[n]),t.createVNode("div",{class:"k-scrollview-elements"},[a&&[this.displayLeftArrow&&t.createVNode("span",{class:"k-scrollview-prev","aria-label":"previous",onClick:this.handlePrevClick},[t.createVNode(i.Icon,{name:this.isRtl?"chevron-right":"chevron-left",icon:this.isRtl?s.chevronRightIcon:s.chevronLeftIcon,size:"xxxlarge"},null)]),this.displayRightArrow&&t.createVNode("span",{class:"k-scrollview-next","aria-label":"next",onClick:this.handleNextClick},[t.createVNode(i.Icon,{name:this.isRtl?"chevron-left":"chevron-right",icon:this.isRtl?s.chevronLeftIcon:s.chevronRightIcon,size:"xxxlarge"},null)])],e&&t.createVNode("div",{class:"k-scrollview-nav-wrap"},[t.createVNode("ul",{class:"k-scrollview-nav"},[this.dataItems.map(function(e,s){return t.createVNode("li",{class:i.classNames("k-link",{"k-primary":this.active===s+1}),key:s+1,onClick:()=>this.setActive(s+1)},null)},this)])])])])},methods:{runAutomaticChange(){if(this.automaticViewChange){this.resetTimeout();const e=this,t=this.active;this.timeoutRef=setTimeout(function(){e.setActive(t===e.dataItems.length?e.endless?1:t:t+1)},this.automaticViewChangeInterval)}},resetTimeout(){this.timeoutRef&&clearTimeout(this.timeoutRef)},setActive(e){this.active=e},focusElement(){this.$el&&this.$el.focus()},prev(){this.endless?this.active>1?this.setActive(this.active-1):this.setActive(this.dataItems.length):this.active>1&&this.setActive(this.active-1)},next(){this.endless?this.active<this.dataItems.length?this.setActive(this.active+1):this.setActive(1):this.active<this.dataItems.length&&this.setActive(this.active+1)},handlePrevClick(){this.isRtl?this.next():this.prev()},handleNextClick(){this.isRtl?this.prev():this.next()},handleKeyDown(e){switch(e.keyCode){case i.Keys.left:e.preventDefault(),this.isRtl?this.next():this.prev();break;case i.Keys.right:e.preventDefault(),this.isRtl?this.prev():this.next()}}}});e.ScrollView=r});
package/index.d.mts CHANGED
@@ -5,220 +5,5 @@
5
5
  * Licensed under commercial license. See LICENSE.md in the package root for more information
6
6
  *-------------------------------------------------------------------------------------------
7
7
  */
8
- import { ComponentOptionsMixin } from 'vue';
9
- import { ComponentProvideOptions } from 'vue';
10
- import { DefineComponent } from 'vue';
11
- import { ExtractPropTypes } from 'vue';
12
- import { PropType } from 'vue';
13
- import { PublicProps } from 'vue';
14
-
15
- /**
16
- *
17
- * Represents the [Kendo UI for Vue Native ScrollView component]({% slug overview_scrollview %}).
18
- *
19
- * ```jsx
20
- * <template>
21
- * <div>
22
- * <ScrollView
23
- * :style="{
24
- * width: '512px',
25
- * height: '384px',
26
- * }"
27
- * :data-items="items"
28
- * :content="'content'"
29
- * >
30
- * <template v-slot:content="{ props }">
31
- * <div class="image-with-text">
32
- * <img
33
- * :src="props.item.url"
34
- * :alt="`Photo ${props.item.position}`"
35
- * :style="{
36
- * width: '512px',
37
- * height: '384px',
38
- * }"
39
- * :draggable="false"
40
- * />
41
- * </div>
42
- * </template>
43
- * </ScrollView>
44
- * </div>
45
- * </template>
46
- *
47
- * <script>
48
- * import { ScrollView } from '@progress/kendo-vue-scrollview';
49
- *
50
- * export default {
51
- * components: {
52
- * ScrollView,
53
- * },
54
- * data() {
55
- * return {
56
- * items: [
57
- * {
58
- * url: 'https://www.telerik.com/kendo-vue-ui/components/layout/assets/card/kukeri.jpg',
59
- * },
60
- * {
61
- * url: 'https://www.telerik.com/kendo-vue-ui/components/layout/assets/card/martenitsa.jpg',
62
- * },
63
- * {
64
- * url: 'https://www.telerik.com/kendo-vue-ui/components/layout/assets/card/rose_festival.jpg',
65
- * },
66
- * ],
67
- * };
68
- * },
69
- * };
70
- * </script>
71
- * ```
72
- */
73
- export declare const ScrollView: DefineComponent<ExtractPropTypes< {
74
- activeView: {
75
- type: PropType<number>;
76
- default: number;
77
- };
78
- dataItems: {
79
- type: PropType<any[]>;
80
- default: () => any[];
81
- };
82
- arrows: {
83
- type: PropType<boolean>;
84
- default: boolean;
85
- };
86
- automaticViewChange: {
87
- type: BooleanConstructor;
88
- default: boolean;
89
- };
90
- automaticViewChangeInterval: {
91
- type: PropType<number>;
92
- default: number;
93
- };
94
- content: PropType<any>;
95
- dir: PropType<string>;
96
- endless: PropType<boolean>;
97
- pageable: {
98
- type: PropType<boolean>;
99
- default: boolean;
100
- };
101
- pagerOverlay: {
102
- type: PropType<string>;
103
- default: string;
104
- };
105
- }>, {}, {
106
- active: number;
107
- currentDir: any;
108
- }, {
109
- scrollViewClasses(): {
110
- 'k-scrollview': boolean;
111
- 'k-scrollview-light': boolean;
112
- 'k-scrollview-dark': boolean;
113
- };
114
- displayLeftArrow(): boolean;
115
- displayRightArrow(): boolean;
116
- isRtl(): boolean;
117
- }, {
118
- runAutomaticChange(): void;
119
- resetTimeout(): void;
120
- setActive(value: number): void;
121
- focusElement(): void;
122
- prev(): void;
123
- next(): void;
124
- handlePrevClick(): void;
125
- handleNextClick(): void;
126
- handleKeyDown(event: any): void;
127
- }, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ExtractPropTypes< {
128
- activeView: {
129
- type: PropType<number>;
130
- default: number;
131
- };
132
- dataItems: {
133
- type: PropType<any[]>;
134
- default: () => any[];
135
- };
136
- arrows: {
137
- type: PropType<boolean>;
138
- default: boolean;
139
- };
140
- automaticViewChange: {
141
- type: BooleanConstructor;
142
- default: boolean;
143
- };
144
- automaticViewChangeInterval: {
145
- type: PropType<number>;
146
- default: number;
147
- };
148
- content: PropType<any>;
149
- dir: PropType<string>;
150
- endless: PropType<boolean>;
151
- pageable: {
152
- type: PropType<boolean>;
153
- default: boolean;
154
- };
155
- pagerOverlay: {
156
- type: PropType<string>;
157
- default: string;
158
- };
159
- }>> & Readonly<{}>, {
160
- activeView: number;
161
- dataItems: any[];
162
- arrows: boolean;
163
- automaticViewChangeInterval: number;
164
- pageable: boolean;
165
- pagerOverlay: string;
166
- automaticViewChange: boolean;
167
- }, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
168
-
169
- /**
170
- * Represents the props of the [Kendo UI for Vue ScrollView component]({% slug overview_scrollview %}).
171
- */
172
- export declare interface ScrollViewProps {
173
- /**
174
- * Represents the current active view ([see example]({% slug activeview_scrollview %})). Defaults to `1`.
175
- */
176
- activeView?: number;
177
- /**
178
- * Enables or disables the built-in navigation arrows ([see example]({% slug arrows_scrollview %})). Defaults to `true`.
179
- */
180
- arrows?: boolean;
181
- /**
182
- * Allows the ScrollView to switch the next page automatically after a short delay ([see example]({% slug automatic_scrolling_scrollview %})).
183
- * Defaults to `true`.
184
- */
185
- automaticViewChange?: boolean;
186
- /**
187
- * Defines the automatic page change delay in milliseconds ([see example]({% slug automatic_scrolling_scrollview %})).
188
- * Defaults to `5000`.
189
- */
190
- automaticViewChangeInterval?: number;
191
- /**
192
- * Content Template for the ScrollView items.
193
- */
194
- content?: any;
195
- /**
196
- * An array of the items that are passed to the ScrollView component.
197
- */
198
- dataItems?: any[];
199
- /**
200
- * Represents the `dir` HTML attribute. This is used to switch from LTR to RTL.
201
- */
202
- dir?: string;
203
- /**
204
- * Toggles the endless scrolling mode in which the data items are endlessly looped
205
- * ([see example]({% slug endlessscrolling_scrollview %})). Defaults to `false`.
206
- */
207
- endless?: boolean;
208
- /**
209
- * Toggles the built-in pager ([see example]({% slug paging_scrollview %})). Defaults to `true`.
210
- */
211
- pageable?: boolean;
212
- /**
213
- * Sets the pager overlay ([see example]({% slug paging_scrollview %})).
214
- *
215
- * * The possible values are:
216
- * * `none`(Default) &mdash; No overlay is set.
217
- * * `dark` &mdash; Dark overlay is set.
218
- * * `light` &mdash; Light overlay is set.
219
- *
220
- */
221
- pagerOverlay?: 'dark' | 'light' | 'none' | string;
222
- }
223
-
224
- export { }
8
+ export * from './ScrollView.js';
9
+ export * from './ScrollViewProps.js';
package/index.d.ts CHANGED
@@ -5,220 +5,5 @@
5
5
  * Licensed under commercial license. See LICENSE.md in the package root for more information
6
6
  *-------------------------------------------------------------------------------------------
7
7
  */
8
- import { ComponentOptionsMixin } from 'vue';
9
- import { ComponentProvideOptions } from 'vue';
10
- import { DefineComponent } from 'vue';
11
- import { ExtractPropTypes } from 'vue';
12
- import { PropType } from 'vue';
13
- import { PublicProps } from 'vue';
14
-
15
- /**
16
- *
17
- * Represents the [Kendo UI for Vue Native ScrollView component]({% slug overview_scrollview %}).
18
- *
19
- * ```jsx
20
- * <template>
21
- * <div>
22
- * <ScrollView
23
- * :style="{
24
- * width: '512px',
25
- * height: '384px',
26
- * }"
27
- * :data-items="items"
28
- * :content="'content'"
29
- * >
30
- * <template v-slot:content="{ props }">
31
- * <div class="image-with-text">
32
- * <img
33
- * :src="props.item.url"
34
- * :alt="`Photo ${props.item.position}`"
35
- * :style="{
36
- * width: '512px',
37
- * height: '384px',
38
- * }"
39
- * :draggable="false"
40
- * />
41
- * </div>
42
- * </template>
43
- * </ScrollView>
44
- * </div>
45
- * </template>
46
- *
47
- * <script>
48
- * import { ScrollView } from '@progress/kendo-vue-scrollview';
49
- *
50
- * export default {
51
- * components: {
52
- * ScrollView,
53
- * },
54
- * data() {
55
- * return {
56
- * items: [
57
- * {
58
- * url: 'https://www.telerik.com/kendo-vue-ui/components/layout/assets/card/kukeri.jpg',
59
- * },
60
- * {
61
- * url: 'https://www.telerik.com/kendo-vue-ui/components/layout/assets/card/martenitsa.jpg',
62
- * },
63
- * {
64
- * url: 'https://www.telerik.com/kendo-vue-ui/components/layout/assets/card/rose_festival.jpg',
65
- * },
66
- * ],
67
- * };
68
- * },
69
- * };
70
- * </script>
71
- * ```
72
- */
73
- export declare const ScrollView: DefineComponent<ExtractPropTypes< {
74
- activeView: {
75
- type: PropType<number>;
76
- default: number;
77
- };
78
- dataItems: {
79
- type: PropType<any[]>;
80
- default: () => any[];
81
- };
82
- arrows: {
83
- type: PropType<boolean>;
84
- default: boolean;
85
- };
86
- automaticViewChange: {
87
- type: BooleanConstructor;
88
- default: boolean;
89
- };
90
- automaticViewChangeInterval: {
91
- type: PropType<number>;
92
- default: number;
93
- };
94
- content: PropType<any>;
95
- dir: PropType<string>;
96
- endless: PropType<boolean>;
97
- pageable: {
98
- type: PropType<boolean>;
99
- default: boolean;
100
- };
101
- pagerOverlay: {
102
- type: PropType<string>;
103
- default: string;
104
- };
105
- }>, {}, {
106
- active: number;
107
- currentDir: any;
108
- }, {
109
- scrollViewClasses(): {
110
- 'k-scrollview': boolean;
111
- 'k-scrollview-light': boolean;
112
- 'k-scrollview-dark': boolean;
113
- };
114
- displayLeftArrow(): boolean;
115
- displayRightArrow(): boolean;
116
- isRtl(): boolean;
117
- }, {
118
- runAutomaticChange(): void;
119
- resetTimeout(): void;
120
- setActive(value: number): void;
121
- focusElement(): void;
122
- prev(): void;
123
- next(): void;
124
- handlePrevClick(): void;
125
- handleNextClick(): void;
126
- handleKeyDown(event: any): void;
127
- }, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ExtractPropTypes< {
128
- activeView: {
129
- type: PropType<number>;
130
- default: number;
131
- };
132
- dataItems: {
133
- type: PropType<any[]>;
134
- default: () => any[];
135
- };
136
- arrows: {
137
- type: PropType<boolean>;
138
- default: boolean;
139
- };
140
- automaticViewChange: {
141
- type: BooleanConstructor;
142
- default: boolean;
143
- };
144
- automaticViewChangeInterval: {
145
- type: PropType<number>;
146
- default: number;
147
- };
148
- content: PropType<any>;
149
- dir: PropType<string>;
150
- endless: PropType<boolean>;
151
- pageable: {
152
- type: PropType<boolean>;
153
- default: boolean;
154
- };
155
- pagerOverlay: {
156
- type: PropType<string>;
157
- default: string;
158
- };
159
- }>> & Readonly<{}>, {
160
- activeView: number;
161
- dataItems: any[];
162
- arrows: boolean;
163
- automaticViewChangeInterval: number;
164
- pageable: boolean;
165
- pagerOverlay: string;
166
- automaticViewChange: boolean;
167
- }, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
168
-
169
- /**
170
- * Represents the props of the [Kendo UI for Vue ScrollView component]({% slug overview_scrollview %}).
171
- */
172
- export declare interface ScrollViewProps {
173
- /**
174
- * Represents the current active view ([see example]({% slug activeview_scrollview %})). Defaults to `1`.
175
- */
176
- activeView?: number;
177
- /**
178
- * Enables or disables the built-in navigation arrows ([see example]({% slug arrows_scrollview %})). Defaults to `true`.
179
- */
180
- arrows?: boolean;
181
- /**
182
- * Allows the ScrollView to switch the next page automatically after a short delay ([see example]({% slug automatic_scrolling_scrollview %})).
183
- * Defaults to `true`.
184
- */
185
- automaticViewChange?: boolean;
186
- /**
187
- * Defines the automatic page change delay in milliseconds ([see example]({% slug automatic_scrolling_scrollview %})).
188
- * Defaults to `5000`.
189
- */
190
- automaticViewChangeInterval?: number;
191
- /**
192
- * Content Template for the ScrollView items.
193
- */
194
- content?: any;
195
- /**
196
- * An array of the items that are passed to the ScrollView component.
197
- */
198
- dataItems?: any[];
199
- /**
200
- * Represents the `dir` HTML attribute. This is used to switch from LTR to RTL.
201
- */
202
- dir?: string;
203
- /**
204
- * Toggles the endless scrolling mode in which the data items are endlessly looped
205
- * ([see example]({% slug endlessscrolling_scrollview %})). Defaults to `false`.
206
- */
207
- endless?: boolean;
208
- /**
209
- * Toggles the built-in pager ([see example]({% slug paging_scrollview %})). Defaults to `true`.
210
- */
211
- pageable?: boolean;
212
- /**
213
- * Sets the pager overlay ([see example]({% slug paging_scrollview %})).
214
- *
215
- * * The possible values are:
216
- * * `none`(Default) &mdash; No overlay is set.
217
- * * `dark` &mdash; Dark overlay is set.
218
- * * `light` &mdash; Light overlay is set.
219
- *
220
- */
221
- pagerOverlay?: 'dark' | 'light' | 'none' | string;
222
- }
223
-
224
- export { }
8
+ export * from './ScrollView';
9
+ export * from './ScrollViewProps';
package/package-metadata.d.ts ADDED
@@ -0,0 +1,12 @@
1
+ /**
2
+ * @license
3
+ *-------------------------------------------------------------------------------------------
4
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
5
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
6
+ *-------------------------------------------------------------------------------------------
7
+ */
8
+ import { PackageMetadata } from '@progress/kendo-licensing';
9
+ /**
10
+ * @hidden
11
+ */
12
+ export declare const packageMetadata: PackageMetadata;
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={name:"@progress/kendo-vue-scrollview",productName:"Kendo UI for Vue",productCode:"KENDOUIVUE",productCodes:["KENDOUIVUE"],publishDate: 1773130431,version:"8.0.3-develop.2",licensingDocsUrl:"https://www.telerik.com/kendo-vue-ui/my-license/"};exports.packageMetadata=e;
8
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e={name:"@progress/kendo-vue-scrollview",productName:"Kendo UI for Vue",productCode:"KENDOUIVUE",productCodes:["KENDOUIVUE"],publishDate: 1773756193,version:"8.0.3-develop.4",licensingDocsUrl:"https://www.telerik.com/kendo-vue-ui/my-license/"};exports.packageMetadata=e;
package/package-metadata.mjs CHANGED
@@ -10,8 +10,8 @@ const e = {
10
10
  productName: "Kendo UI for Vue",
11
11
  productCode: "KENDOUIVUE",
12
12
  productCodes: ["KENDOUIVUE"],
13
- publishDate: 1773130431,
14
- version: "8.0.3-develop.2",
13
+ publishDate: 1773756193,
14
+ version: "8.0.3-develop.4",
15
15
  licensingDocsUrl: "https://www.telerik.com/kendo-vue-ui/my-license/"
16
16
  };
17
17
  export {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@progress/kendo-vue-scrollview",
3
- "version": "8.0.3-develop.2",
3
+ "version": "8.0.3-develop.4",
4
4
  "description": "TODO",
5
5
  "author": "Progress",
6
6
  "license": "SEE LICENSE IN LICENSE.md",
@@ -9,8 +9,14 @@
9
9
  "types": "./index.d.ts",
10
10
  "exports": {
11
11
  ".": {
12
- "import": "./index.mjs",
13
- "require": "./index.js"
12
+ "import": {
13
+ "types": "./index.d.mts",
14
+ "default": "./index.mjs"
15
+ },
16
+ "require": {
17
+ "types": "./index.d.ts",
18
+ "default": "./index.js"
19
+ }
14
20
  },
15
21
  "./package.json": {
16
22
  "default": "./package.json"
@@ -19,7 +25,7 @@
19
25
  "sideEffects": false,
20
26
  "peerDependencies": {
21
27
  "@progress/kendo-licensing": "^1.7.2",
22
- "@progress/kendo-vue-common": "8.0.3-develop.2",
28
+ "@progress/kendo-vue-common": "8.0.3-develop.4",
23
29
  "@progress/kendo-svg-icons": "^4.4.0",
24
30
  "vue": "^3.0.2"
25
31
  },
@@ -40,7 +46,7 @@
40
46
  "package": {
41
47
  "productName": "Kendo UI for Vue",
42
48
  "productCode": "KENDOUIVUE",
43
- "publishDate": 1773130431,
49
+ "publishDate": 1773756193,
44
50
  "licensingDocsUrl": "https://www.telerik.com/kendo-vue-ui/my-license/"
45
51
  }
46
52
  },