@progress/kendo-vue-scrollview 3.2.3-dev.202204191450
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/LICENSE.md +11 -0
- package/NOTICE.txt +86 -0
- package/README.md +37 -0
- package/dist/cdn/js/kendo-vue-scrollview.js +1 -0
- package/dist/es/ScrollView.d.ts +54 -0
- package/dist/es/ScrollView.js +295 -0
- package/dist/es/ScrollViewProps.d.ts +54 -0
- package/dist/es/ScrollViewProps.js +0 -0
- package/dist/es/additionalTypes.ts +9 -0
- package/dist/es/main.d.ts +2 -0
- package/dist/es/main.js +2 -0
- package/dist/es/package-metadata.d.ts +5 -0
- package/dist/es/package-metadata.js +11 -0
- package/dist/npm/ScrollView.d.ts +54 -0
- package/dist/npm/ScrollView.js +306 -0
- package/dist/npm/ScrollViewProps.d.ts +54 -0
- package/dist/npm/ScrollViewProps.js +5 -0
- package/dist/npm/additionalTypes.ts +9 -0
- package/dist/npm/main.d.ts +2 -0
- package/dist/npm/main.js +14 -0
- package/dist/npm/package-metadata.d.ts +5 -0
- package/dist/npm/package-metadata.js +14 -0
- package/package.json +54 -0
package/LICENSE.md
ADDED
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
# Kendo UI for Vue
|
|
2
|
+
|
|
3
|
+
This package is part of the [Kendo UI for Vue](https://www.telerik.com/kendo-vue-ui/) suite.
|
|
4
|
+
|
|
5
|
+
## License
|
|
6
|
+
|
|
7
|
+
This is commercial software. To use it, you need to agree to the [**Telerik End User License Agreement for Kendo UI**](https://www.telerik.com/purchase/license-agreement/kendo-ui). If you do not own a commercial license, this file shall be governed by the trial license terms.
|
|
8
|
+
|
|
9
|
+
All available Kendo UI commercial licenses may be obtained at https://www.telerik.com/purchase/kendo-ui.
|
|
10
|
+
|
|
11
|
+
*Copyright © 2021 Progress Software Corporation and/or one of its subsidiaries or affiliates. All Rights Reserved.*
|
package/NOTICE.txt
ADDED
|
@@ -0,0 +1,86 @@
|
|
|
1
|
+
Progress Kendo UI for Vue 3
|
|
2
|
+
|
|
3
|
+
Copyright © 2021-2022 Progress Software Corporation and/or one of its subsidiaries or affiliates. All rights reserved.
|
|
4
|
+
|
|
5
|
+
Portions of the Product include certain open source and commercial third-party components listed below (ìThird-Party Componentsî). The authors of the Third-Party Components require Progress Software Corporation (ìPSCî) to include the following notices and additional licensing terms as a condition of PSCís use of such Third-Party Components. You acknowledge that the authors of the Third-Party Components have no obligation to provide support to you for the Third-Party Components or the Product. You hereby undertake to comply with all licenses related to the applicable Third-Party Components. Notwithstanding anything to the contrary, to the extent that any of the terms and conditions of the Product Agreement conflict, vary, or are in addition to the terms and conditions of the aforementioned third-party licenses for these technologies, such terms and conditions are offered by PSC alone and not by any other party.
|
|
6
|
+
|
|
7
|
+
-------------------------------------------------------------------------
|
|
8
|
+
SUMMARY OF COMPONENTS:
|
|
9
|
+
|
|
10
|
+
VendorName | ComponentName | VersionName | LicenseType
|
|
11
|
+
|
|
12
|
+
|
|
13
|
+
Axios | Axios | 0.18.1 - Open Source | MIT-style License
|
|
14
|
+
DefinitelyTyped.org | @types/prosemirror-commands | 1.0.4 - Open Source | MIT-style License
|
|
15
|
+
DefinitelyTyped.org | @types/prosemirror-dropcursor | 1.0.1 - Open Source | MIT-style License
|
|
16
|
+
DefinitelyTyped.org | @types/prosemirror-gapcursor | 1.0.2 - Open Source | MIT-style License
|
|
17
|
+
DefinitelyTyped.org | @types/prosemirror-history | 1.0.2 - Open Source | MIT-style License
|
|
18
|
+
DefinitelyTyped.org | @types/prosemirror-inputrules | 1.0.2 - Open Source | MIT-style License
|
|
19
|
+
DefinitelyTyped.org | @types/prosemirror-keymap | 1.0.2 - Open Source | MIT-style License
|
|
20
|
+
DefinitelyTyped.org | @types/prosemirror-model | 1.11.2 - Open Source | MIT-style License
|
|
21
|
+
DefinitelyTyped.org | @types/prosemirror-schema-list | 1.0.2 - Open Source | MIT-style License
|
|
22
|
+
DefinitelyTyped.org | @types/prosemirror-state | 1.2.4 - Open Source | MIT-style License
|
|
23
|
+
DefinitelyTyped.org | @types/prosemirror-tables | 0.9.1 - Open Source | MIT-style License
|
|
24
|
+
DefinitelyTyped.org | @types/prosemirror-transform | 1.2.9 - Open Source | MIT-style License
|
|
25
|
+
DefinitelyTyped.org | @types/prosemirror-view | 1.11.4 - Open Source | MIT-style License
|
|
26
|
+
Progress Software | Kendo UI Licensing CLI | 1.1 - Proprietary |
|
|
27
|
+
Progress Software Corporation | jszip-esm | 1.0.0 - Open Source | MIT-style License
|
|
28
|
+
Progress Software Corporation | pako-esm | 1.0.0 - Open Source | MIT-style License
|
|
29
|
+
ProseMirror | prosemiror-inputrules | 1.0.1 - Open Source | MIT-style License
|
|
30
|
+
ProseMirror | prosemirror-commands | 1.0.7 - Open Source | MIT-style License
|
|
31
|
+
ProseMirror | prosemirror-gapcursor | 1.0.2 - Open Source | MIT-style License
|
|
32
|
+
ProseMirror | prosemirror-history | 1.0.2 - Open Source | MIT-style License
|
|
33
|
+
ProseMirror | prosemirror-keymap | 1.0.1 - Open Source | MIT-style License
|
|
34
|
+
ProseMirror | prosemirror-model | 1.6.1 - Open Source | MIT-style License
|
|
35
|
+
ProseMirror | prosemirror-schema-list | 1.0.1 - Open Source | MIT-style License
|
|
36
|
+
ProseMirror | prosemirror-state | 1.2.2 - Open Source | MIT-style License
|
|
37
|
+
ProseMirror | prosemirror-tables | 0.7.10 - Open Source | MIT-style License
|
|
38
|
+
ProseMirror | prosemirror-transform | 1.1.3 - Open Source | MIT-style License
|
|
39
|
+
ProseMirror | prosemirror-view | 1.5.2 - Open Source | MIT-style License
|
|
40
|
+
-------------------------------------------------------------------------
|
|
41
|
+
|
|
42
|
+
1. Special Notices Regarding Open-Source Third-Party Components incorporated into the Product:
|
|
43
|
+
|
|
44
|
+
(1) MIT-style Licenses:
|
|
45
|
+
|
|
46
|
+
(a) Progress Kendo UI for Vue 3 incorporates jszip-esm v1.0. Such technology is subject to the following terms and conditions:
|
|
47
|
+
Copyright © 2020 Progress Software Corporation and/or one of its subsidiaries or affiliates. All rights reserved. (as modified)
|
|
48
|
+
Copyright (c) 2009-2016 Stuart Knightley, David Duponchel, Franz Buchinger, AntÛnio Afonso
|
|
49
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
|
|
50
|
+
The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
|
|
51
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
|
52
|
+
|
|
53
|
+
(b) Progress Kendo UI for Vue 3 incorporates pako-esm v1.0. Such technology is subject to the following terms and conditions:
|
|
54
|
+
Copyright © 2020 Progress Software Corporation and/or one of its subsidiaries or affiliates. All rights reserved. (as modified)
|
|
55
|
+
Copyright (C) 2014-2017 by Vitaly Puzrin and Andrei Tuputcyn
|
|
56
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
|
|
57
|
+
The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
|
|
58
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
|
59
|
+
|
|
60
|
+
(c) Progress Kendo UI for Vue 3 incorporates axios v0.18.1. Such technology is subject to the following terms and conditions:
|
|
61
|
+
Copyright (c) 2014-present Matt Zabriskie
|
|
62
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
|
|
63
|
+
The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
|
|
64
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
|
65
|
+
|
|
66
|
+
(d) Progress Kendo UI for Vue 3 incorporates @types/prosemirror-commands v1.0.4, @types/prosemirror-dropcursor v1.0.1, @types/prosemirror-gapcursor v1.0.2, @types/prosemirror-history v1.0.2, @types/prosemirror-inputrules v1.0.2, @types/prosemirror-keymap v1.0.2, @types/prosemirror-model v1.11.2, @types/prosemirror-schema-list v1.0.2, @types/prosemirror-state v1.2.4, @types/prosemirror-tables v0.9.1, @types/prosemirror-transform v1.2.9, and @types/prosemirror-view v1.11.4. Such technologies are subject to the following terms and conditions:
|
|
67
|
+
This project is licensed under the MIT license.
|
|
68
|
+
Copyrights are respective of each contributor listed at the beginning of each definition file.
|
|
69
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
|
|
70
|
+
The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
|
|
71
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
|
72
|
+
|
|
73
|
+
(e) Progress Kendo UI for Vue 3 incorporates prosemiror-inputrules v1.0.1, prosemirror-commands v1.0.7, prosemirror-gapcursor v1.0.7, prosemirror-history v1.0.2, prosemirror-keymap v1.0.1, prosemirror-model v1.6.1, prosemirror-schema-list v1.0.1, prosemirror-state v1.2.2, prosemirror-tables v0.7.10, prosemirror-transform v1.1.3, and prosemirror-view v1.5.2. Such technologies are subject to the following terms and conditions:
|
|
74
|
+
Copyright (C) 2015-2017 by Marijn Haverbeke <marijnh@gmail.com> and others. Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
|
|
75
|
+
The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
|
|
76
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
|
77
|
+
|
|
78
|
+
2. Special Notices Regarding Commercially Licensed Third-Party Components incorporated into the Product: NONE
|
|
79
|
+
|
|
80
|
+
3. Special Notices Regarding Progress Products incorporated into the Product:
|
|
81
|
+
|
|
82
|
+
(a) Progress Kendo UI for Vue 3 incorporates Progress Kendo UI Licensing CLI v1.1 licensed from Progress Software Corporation See NOTICE.txt text file within product for third-party license information.
|
|
83
|
+
|
|
84
|
+
NOTICE FROM PROGRESS SOFTWARE CORPORATION: Additional notices may be included in the release notes or other documentation that accompanies updates received in connection with support of the Product.
|
|
85
|
+
|
|
86
|
+
Updated 4.Apr.2022
|
package/README.md
ADDED
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
<a href="https://www.telerik.com/kendo-vue-ui/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-vue-trial-npm-scrollview&utm_content=banner" target="_blank">
|
|
2
|
+
<img src="https://www.telerik.com/kendo-vue-ui/npm-banner.svg">
|
|
3
|
+
</a>
|
|
4
|
+
|
|
5
|
+
|
|
6
|
+
# Kendo UI for Vue ScrollView Component for Vue
|
|
7
|
+
|
|
8
|
+
> **Important**
|
|
9
|
+
> * This package is а part of [Kendo UI for Vue](https://www.telerik.com/kendo-vue-ui/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-vue-trial-npm-scrollview)—a commercial UI library.
|
|
10
|
+
> * You will need to install a license key when adding the package to your project. For more information, please refer to the [Kendo UI for Vue My License page](https://www.telerik.com/kendo-vue-ui/my-license/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-vue-trial-npm-scrollview).
|
|
11
|
+
> * To receive a license key, you need to either [purchase a license](https://www.telerik.com/kendo-vue-ui/pricing/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-vue-trial-npm-scrollview) or register for a [free trial](https://www.telerik.com/try/kendo-vue-ui?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-vue-trial-npm-scrollview). Doing so indicates that you [accept the Kendo UI for Vue License Agreement](https://www.telerik.com/purchase/license-agreement/progress-kendovue?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-vue-trial-npm-scrollview).
|
|
12
|
+
> * The 30-day free trial gives you access to all the Kendo UI for Vue components and their full functionality. Additionally, for the period of your license, you get access to our legendary technical support provided directly by the Kendo UI for Vue dev team!
|
|
13
|
+
>
|
|
14
|
+
> [Start using Kendo UI for Vue](https://www.telerik.com/try/kendo-vue-ui?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-vue-trial-npm-scrollview) and speed up your development process!
|
|
15
|
+
|
|
16
|
+
## Support Options
|
|
17
|
+
|
|
18
|
+
For any issues you might encounter while working with the Kendo UI for Vue ScrollView, use any of the available support channels:
|
|
19
|
+
|
|
20
|
+
* Industry-leading technical support—Kendo UI for Vue paid license holders and users with an active (free) trial license can take advantage of our outstanding customer support. To submit a ticket, use [the dedicated Kendo UI for Vue support system](https://www.telerik.com/account/support-tickets?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-vue-trial-npm-scrollview).
|
|
21
|
+
* Product forums—The [Kendo UI for Vue forums](https://www.telerik.com/forums/kendo-ui-vue?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-vue-trial-npm-scrollview) are part of the free support you can get from the community and from the Kendo UI for Vue team.
|
|
22
|
+
* Feedback portal—The [Kendo UI for Vue feedback portal](https://feedback.telerik.com/kendo-vue-ui?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-vue-trial-npm-scrollview) is where you can request and vote for new features to be added.
|
|
23
|
+
|
|
24
|
+
## Resources
|
|
25
|
+
|
|
26
|
+
* [Getting Started with Kendo UI for Vue](https://www.telerik.com/kendo-vue-ui/getting-started/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-vue-trial-npm-scrollview)
|
|
27
|
+
* [Get Started with the Kendo UI for Vue ScrollView](https://www.telerik.com/kendo-vue-ui/components/scrollview/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-vue-trial-npm-scrollview)
|
|
28
|
+
* [API Reference of the Kendo UI for Vue ScrollView](https://www.telerik.com/kendo-vue-ui/components/scrollview/api/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-vue-trial-npm-scrollview)
|
|
29
|
+
* [Kendo UI for Vue Roadmap](https://www.telerik.com/support/whats-new/kendo-vue-ui/roadmap?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-vue-trial-npm-scrollview)
|
|
30
|
+
* [Blogs](https://www.telerik.com/blogs/tag/vue?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-vue-trial-npm-scrollview)
|
|
31
|
+
* [Demos, documentation, and component reference](https://www.telerik.com/kendo-vue-ui/components/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-vue-trial-npm-scrollview)
|
|
32
|
+
* [Kendo UI for Vue pricing and licensing](https://www.telerik.com/kendo-vue-ui/pricing/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-vue-trial-npm-scrollview)
|
|
33
|
+
* [Changelog](https://www.telerik.com/kendo-vue-ui/components/changelogs/ui-for-vue/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-vue-trial-npm-scrollview)
|
|
34
|
+
|
|
35
|
+
*Copyright © 2021 Progress Software Corporation and/or its subsidiaries or affiliates. All Rights Reserved.*
|
|
36
|
+
|
|
37
|
+
*Progress, Telerik, and certain product names used herein are trademarks or registered trademarks of Progress Software Corporation and/or one of its subsidiaries or affiliates in the U.S. and/or other countries.*
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("vue"),require("@progress/kendo-licensing")):"function"==typeof define&&define.amd?define(["vue","@progress/kendo-licensing"],t):"object"==typeof exports?exports.KendoVueScrollview=t(require("vue"),require("@progress/kendo-licensing")):e.KendoVueScrollview=t(e.Vue,e.KendoLicensing)}(window,(function(e,t){return function(e){var t={};function n(i){if(t[i])return t[i].exports;var r=t[i]={i:i,l:!1,exports:{}};return e[i].call(r.exports,r,r.exports,n),r.l=!0,r.exports}return n.m=e,n.c=t,n.d=function(e,t,i){n.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:i})},n.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},n.t=function(e,t){if(1&t&&(e=n(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var i=Object.create(null);if(n.r(i),Object.defineProperty(i,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var r in e)n.d(i,r,function(t){return e[t]}.bind(null,r));return i},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="",n(n.s=2)}([function(t,n){t.exports=e},function(e,n){e.exports=t},function(e,t,n){"use strict";var i=Object.create?function(e,t,n,i){void 0===i&&(i=n),Object.defineProperty(e,i,{enumerable:!0,get:function(){return t[n]}})}:function(e,t,n,i){void 0===i&&(i=n),e[i]=t[n]},r=function(e,t){for(var n in e)"default"===n||t.hasOwnProperty(n)||i(t,e,n)};Object.defineProperty(t,"__esModule",{value:!0}),r(n(3),t),r(n(5),t)},function(e,t,n){"use strict";var i=Object.create?function(e,t,n,i){void 0===i&&(i=n),Object.defineProperty(e,i,{enumerable:!0,get:function(){return t[n]}})}:function(e,t,n,i){void 0===i&&(i=n),e[i]=t[n]},r=Object.create?function(e,t){Object.defineProperty(e,"default",{enumerable:!0,value:t})}:function(e,t){e.default=t},o=function(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var n in e)"default"!==n&&Object.hasOwnProperty.call(e,n)&&i(t,e,n);return r(t,e),t};Object.defineProperty(t,"__esModule",{value:!0}),t.ScrollViewVue2=t.ScrollView=void 0;var s=o(n(0)).h,u=n(6),a=n(4),c={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:function(){u.validatePackage(a.packageMetadata),this.timeoutRef=null},mounted:function(){this.wrapElement=this.v3?this.wrapElementRef:this.$refs.wrapElement,this.currentDir=void 0!==this.$props.dir?this.$props.dir:u.isRtl(this.$el)?"rtl":"ltr",this.runAutomaticChange()},updated:function(){var 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:function(){return{active:this.activeView||1,currentDir:void 0}},computed:{scrollViewClasses:function(){return{"k-widget":!0,"k-scrollview":!0,"k-scrollview-light":"light"===this.pagerOverlay,"k-scrollview-dark":"dark"===this.pagerOverlay}},displayLeftArrow:function(){var e;return e=this.isRtl?this.active<this.dataItems.length:this.active>1,(this.endless||e)&&this.dataItems.length>0},displayRightArrow:function(){var e;return e=this.isRtl?this.active>1:this.active<this.dataItems.length,(this.endless||e)&&this.dataItems.length>0},isRtl:function(){return"rtl"===this.currentDir}},setup:s?function(){return{v3:!!s}}:void 0,render:function(e){var t=this,n=s||e,i=this.$props,r=i.pageable,o=i.arrows,a=i.content,c=this.dataItems.length,l=this.dataItems.map((function(e,t){var i=u.templateRendering.call(this,e.content||a,u.getListeners.call(this)),r=u.getTemplate.call(this,{h:n,template:i,defaultRendering:null,additionalProps:{item:e,items:this.dataItems}});return n("div",{class:"k-scrollview-view","aria-hidden":this.active!==t+1,attrs:this.v3?void 0:{"aria-hidden":this.active!==t+1}},[r])}),this);return n("div",{class:this.scrollViewClasses,tabIndex:0,attrs:this.v3?void 0:{tabIndex:0,dir:this.currentDir},dir:this.currentDir,onKeydown:this.handleKeyDown,on:this.v3?void 0:{keydown:this.handleKeyDown}},[n("div",{class:"k-scrollview-wrap k-scrollview-animate",style:"--kendo-scrollview-views:"+c+"; --kendo-scrollview-current:"+this.active+";",ref:this.v3?function(e){t.wrapElementRef=e}:"wrapElement"},[l]),n("div",{class:"k-scrollview-elements"},[o&&[this.displayLeftArrow&&n("a",{class:"k-scrollview-prev","aria-label":"previous",attrs:this.v3?void 0:{"aria-label":"previous"},onClick:this.handlePrevClick,on:this.v3?void 0:{click:this.handlePrevClick}},[n("span",{class:"k-icon k-i-arrowhead-w"})]),this.displayRightArrow&&n("a",{class:"k-scrollview-next","aria-label":"next",attrs:this.v3?void 0:{"aria-label":"next"},onClick:this.handleNextClick,on:this.v3?void 0:{click:this.handleNextClick}},[n("span",{class:"k-icon k-i-arrowhead-e"})])],r&&n("div",{class:"k-scrollview-nav-wrap"},[n("ul",{class:"k-scrollview-nav"},[this.dataItems.map((function(e,t){var i=this;return n("li",{class:u.classNames("k-link",{"k-primary":this.active===t+1}),key:t+1,onClick:function(){return i.setActive(t+1)},on:this.v3?void 0:{click:function(){return i.setActive(t+1)}}})}),this)])])])])},methods:{runAutomaticChange:function(){if(this.automaticViewChange){this.resetTimeout();var e=this,t=this.active;this.timeoutRef=setTimeout((function(){e.setActive(t===e.dataItems.length?e.endless?1:t:t+1)}),this.automaticViewChangeInterval)}},resetTimeout:function(){this.timeoutRef&&clearTimeout(this.timeoutRef)},setActive:function(e){this.active=e},focusElement:function(){this.$el&&this.$el.focus()},prev:function(){this.endless?this.active>1?this.setActive(this.active-1):this.setActive(this.dataItems.length):this.active>1&&this.setActive(this.active-1)},next:function(){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:function(){this.isRtl?this.next():this.prev()},handleNextClick:function(){this.isRtl?this.prev():this.next()},handleKeyDown:function(e){switch(e.keyCode){case u.Keys.left:e.preventDefault(),this.isRtl?this.next():this.prev();break;case u.Keys.right:e.preventDefault(),this.isRtl?this.prev():this.next()}}}};t.ScrollViewVue2=c;var l=c;t.ScrollView=l},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.packageMetadata=void 0,t.packageMetadata={name:"@progress/kendo-vue-scrollview",productName:"Kendo UI for Vue",productCodes:["KENDOUIVUE","KENDOUICOMPLETE"],publishDate:1650379628,version:"",licensingDocsUrl:"https://www.telerik.com/kendo-vue-ui/my-license/?utm_medium=product&utm_source=kendovue&utm_campaign=kendo-ui-vue-purchase-license-keys-warning"}},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0})},function(e,t,n){"use strict";n.r(t),n.d(t,"classNames",(function(){return i})),n.d(t,"guid",(function(){return r})),n.d(t,"Keys",(function(){return o})),n.d(t,"noop",(function(){return S})),n.d(t,"getListeners",(function(){return I})),n.d(t,"hasListener",(function(){return $})),n.d(t,"canUseDOM",(function(){return s})),n.d(t,"focusFirstFocusableChild",(function(){return u})),n.d(t,"clone",(function(){return P})),n.d(t,"Draggable",(function(){return k})),n.d(t,"cloneArray",(function(){return x})),n.d(t,"cloneValue",(function(){return j})),n.d(t,"cloneObject",(function(){return C})),n.d(t,"cloneDate",(function(){return O})),n.d(t,"getTemplate",(function(){return L})),n.d(t,"templateRendering",(function(){return K})),n.d(t,"getTabIndex",(function(){return N})),n.d(t,"getDefaultSlots",(function(){return w})),n.d(t,"isRtl",(function(){return X})),n.d(t,"getDir",(function(){return Y})),n.d(t,"getter",(function(){return E})),n.d(t,"setter",(function(){return M})),n.d(t,"validatePackage",(function(){return F})),n.d(t,"kendoThemeMaps",(function(){return B}));var i=function(){for(var e=[],t=0;t<arguments.length;t++)e[t]=arguments[t];return e.filter((function(e){return!0!==e&&!!e})).map((function(e){return Array.isArray(e)?i.apply(void 0,e):"object"==typeof e?Object.keys(e).map((function(t,n){return e[n]||e[t]&&t||null})).filter((function(e){return null!==e})).join(" "):e})).filter((function(e){return!!e})).join(" ")},r=function(){var e,t,n="";for(e=0;e<32;e++)t=16*Math.random()|0,8!==e&&12!==e&&16!==e&&20!==e||(n+="-"),n+=(12===e?4:16===e?3&t|8:t).toString(16);return n},o={backspace:8,tab:9,enter:13,shift:16,esc:27,space:32,pageUp:33,pageDown:34,end:35,home:36,left:37,up:38,right:39,down:40,delete:46},s=Boolean("undefined"!=typeof window&&window.document&&window.document.createElement),u=function(e){if(e){var t=e.querySelectorAll('input, [tabindex]:not([tabindex="-1"])');t.length&&t[0].focus&&t[0].focus()}},a=n(0),c=function(e,t){return function(n){return t(e(n))}},l=function(e,t,n){return e.addEventListener&&e.addEventListener(t,n)},d=function(e,t,n){return e&&e.removeEventListener&&e.removeEventListener(t,n)},h=function(){},f=function(e){return e.preventDefault()},p=/touch/;function v(e){return e.type.match(p)?{pageX:e.changedTouches[0].pageX,pageY:e.changedTouches[0].pageY,clientX:e.changedTouches[0].clientX,clientY:e.changedTouches[0].clientY,type:e.type,originalEvent:e,isTouch:!0}:{pageX:e.pageX,pageY:e.pageY,clientX:e.clientX,clientY:e.clientY,offsetX:e.offsetX,offsetY:e.offsetY,type:e.type,ctrlKey:e.ctrlKey,shiftKey:e.shiftKey,altKey:e.altKey,originalEvent:e}}var m=function(e){var t=this,n=e.press;void 0===n&&(n=h);var i=e.drag;void 0===i&&(i=h);var r=e.release;void 0===r&&(r=h);var o=e.mouseOnly;void 0===o&&(o=!1),this._pressHandler=c(v,n),this._dragHandler=c(v,i),this._releaseHandler=c(v,r),this._ignoreMouse=!1,this._mouseOnly=o,this._touchstart=function(e){1===e.touches.length&&t._pressHandler(e)},this._touchmove=function(e){1===e.touches.length&&t._dragHandler(e)},this._touchend=function(e){0===e.touches.length&&1===e.changedTouches.length&&(t._releaseHandler(e),t._ignoreMouse=!0,setTimeout(t._restoreMouse,2e3))},this._restoreMouse=function(){t._ignoreMouse=!1},this._mousedown=function(e){var n=e.which;n&&n>1||t._ignoreMouse||(l(document,"mousemove",t._mousemove),l(document,"mouseup",t._mouseup),t._pressHandler(e))},this._mousemove=function(e){t._dragHandler(e)},this._mouseup=function(e){d(document,"mousemove",t._mousemove),d(document,"mouseup",t._mouseup),t._releaseHandler(e)},this._pointerdown=function(e){e.isPrimary&&0===e.button&&(l(document,"pointermove",t._pointermove),l(document,"pointerup",t._pointerup),l(document,"pointercancel",t._pointerup),l(document,"contextmenu",f),t._pressHandler(e))},this._pointermove=function(e){e.isPrimary&&t._dragHandler(e)},this._pointerup=function(e){e.isPrimary&&(d(document,"pointermove",t._pointermove),d(document,"pointerup",t._pointerup),d(document,"pointercancel",t._pointerup),d(document,"contextmenu",f),t._releaseHandler(e))}};m.supportPointerEvent=function(){return"undefined"!=typeof window&&window.PointerEvent},m.prototype.bindTo=function(e){e!==this._element&&(this._element&&this._unbindFromCurrent(),this._element=e,this._bindToCurrent())},m.prototype._bindToCurrent=function(){var e=this._element;this._usePointers()?l(e,"pointerdown",this._pointerdown):(l(e,"mousedown",this._mousedown),this._mouseOnly||(l(e,"touchstart",this._touchstart),l(e,"touchmove",this._touchmove),l(e,"touchend",this._touchend)))},m.prototype._unbindFromCurrent=function(){var e=this._element;if(this._usePointers())return d(e,"pointerdown",this._pointerdown),d(document,"pointermove",this._pointermove),d(document,"pointerup",this._pointerup),d(document,"contextmenu",f),void d(document,"pointercancel",this._pointerup);d(e,"mousedown",this._mousedown),this._mouseOnly||(d(e,"touchstart",this._touchstart),d(e,"touchmove",this._touchmove),d(e,"touchend",this._touchend))},m.prototype._usePointers=function(){return!this._mouseOnly&&m.supportPointerEvent()},m.prototype.update=function(e){var t=e.press;void 0===t&&(t=h);var n=e.drag;void 0===n&&(n=h);var i=e.release;void 0===i&&(i=h);var r=e.mouseOnly;void 0===r&&(r=!1),this._pressHandler=c(v,t),this._dragHandler=c(v,n),this._releaseHandler=c(v,i),this._mouseOnly=r},m.prototype.destroy=function(){this._unbindFromCurrent(),this._element=null},m.default=m;var g,y=m;function w(e){var t=e.$slots.default;return e.v3&&t&&"function"==typeof t?t():t}function _(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}var b=a.h,k=(_(g={emits:{press:null,drag:null,release:null},inheritAttrs:!1,created:function(){this.element=null,this.draggable=new y({press:this.press,drag:this.drag,release:this.release})},setup:b?function(){return{v3:!!b}}:void 0,mounted:function(){this.$el&&(this.element=3===this.$el.nodeType?this.$el.nextElementSibling:this.$el,this.draggable.bindTo(this.element))},destroyed:b?void 0:function(){this.draggable.destroy()},unmounted:function(){this.draggable.destroy()},methods:{press:function(e){this.element&&this.$emit("press",e,this.element)},drag:function(e){this.element&&this.$emit("drag",e,this.element)},release:function(e){this.element&&this.$emit("release",e,this.element)}}},"setup",b?function(){return{v3:!!b}}:void 0),_(g,"render",(function(e){return w(this)})),g),O=function(e){return e?new Date(e.getTime()):null};function P(e){var t={};return C(e,t),t}function C(e,t){for(var n in e)if(e.hasOwnProperty(n)){var i=e[n];t[n]=j(i,t[n])}}function j(e,t){if(Array.isArray(e))return x(e);if(e instanceof Date)return O(e);if(e&&"object"==typeof e){var n=t||{};return C(e,n),n}return e}function x(e){return e.map((function(e){return j(e,void 0)}))}var S=function(){},A=/\[(?:(\d+)|['"](.*?)['"])\]|((?:(?!\[.*?\]|\.).)+)/g,D={};function E(e){if(D[e])return D[e];var t=[];return e.replace(A,(function(e,n,i,r){t.push(void 0!==n?n:i||r)})),D[e]=function(e){for(var n=e,i=0;i<t.length&&n;i++)n=n[t[i]];return n},D[e]}D.undefined=function(){};var T={};function M(e){if(T[e])return T[e];var t=[];return e.replace(A,(function(e,n,i,r){t.push(void 0!==n?n:i||r)})),T[e]=function(e,n){for(var i=e,r=t.length-1,o=0;o<r&&i;o++)i=i[t[o]]=i[t[o]]||{};i[t[r]]=n},T[e]}function $(e){return this.v3?Object.keys(this.$attrs).map((function(e){return e.toLowerCase()})).some((function(t){return t.endsWith(e.toLowerCase())})):this.$listeners[e]}function I(){if(this.v3){var e={};for(var t in this.$attrs)t.startsWith("on")&&(e[t]=this.$attrs[t]);return e}return this.$listeners}T.undefined=function(e){return e};var R=function(){return(R=Object.assign||function(e){for(var t,n=1,i=arguments.length;n<i;n++)for(var r in t=arguments[n])Object.prototype.hasOwnProperty.call(t,r)&&(e[r]=t[r]);return e}).apply(this,arguments)},V=a.h;function K(e,t){if(e){var n=V?this.$slots[e]||(e.toLowerCase?this.$slots[e.toLowerCase()]:null):this.$scopedSlots[e]||(e.toLowerCase?this.$scopedSlots[e.toLowerCase()]:null);return"string"==typeof e&&n?{type:"slot",render:n,listeners:t}:"string"==typeof e||"object"==typeof e||"function"==typeof e&&e.component?{type:"component",render:e,listeners:t}:{type:"renderFunction",render:e,listeners:t}}}function L(e){var t,n,i,r=e.h,o=e.template,s=e.defaultRendering,u=e.defaultSlots,a=e.additionalProps,c=e.additionalListeners,l=e.swapDefaultSlots;if(!o)return s;if(V){var d=s?s.props:{};t=R(R({},H(c)),o.listeners),n=R(R(R({},d),a),t),i=R(R({},n),t)}else{var h=s&&s.componentOptions,f=h?s.componentOptions.listeners:{},p=h?s.componentOptions.propsData:{};t=R(R(R(R({},f),c),H(c)),o.listeners),i={props:n=R(R(R({},p),a),t),on:t}}if("slot"===o.type){var v=o.render({props:n,listeners:t,methods:t,defaultSlots:u});return v?v[0]:void 0}return"renderFunction"===o.type?l?o.render(r,s,u,n,t):o.render(r,s,n,t,u):r(o.render,i,V?function(){return[u]}:[u])}function H(e){if(!e)return e;for(var t={},n=Object.keys(e),i=0;i<n.length;i++){var r=n[i];t["on"+r.charAt(0).toUpperCase()+r.slice(1)]=e[r]}return t}var N=function(e,t,n){var i="string"==typeof e?parseInt(e,void 0):e;if(NaN!==i)return void 0!==i?i:t?n?void 0:-1:0};function X(e){return Boolean(s&&e&&"rtl"===getComputedStyle(e).direction)}function Y(e,t){if(!t&&s&&e){var n=window.getComputedStyle(e).direction;if(n)return n}return t}var U=n(1);function F(e){if(void 0!==U)U.validatePackage(e);else{var t="License activation failed for "+e.name+"\n";t+="The @progress/kendo-licensing script is not loaded.\n",t+="See "+e.licensingDocsUrl+" for more information.\n",console.warn(t)}}var B={sizeMap:{small:"sm",medium:"md",large:"lg"},roundedMap:{small:"sm",medium:"md",large:"lg"}}}])}));
|
|
@@ -0,0 +1,54 @@
|
|
|
1
|
+
import { DefineComponent } from './additionalTypes';
|
|
2
|
+
import { RecordPropsDefinition, ComponentOptions } from 'vue/types/options';
|
|
3
|
+
declare type DefaultData<V> = object | ((this: V) => {});
|
|
4
|
+
declare type DefaultMethods<V> = {
|
|
5
|
+
[key: string]: (this: V, ...args: any[]) => any;
|
|
6
|
+
};
|
|
7
|
+
import { ScrollViewProps } from './ScrollViewProps';
|
|
8
|
+
/**
|
|
9
|
+
* The ScrollView ref.
|
|
10
|
+
*/
|
|
11
|
+
export interface ScrollViewHandle {
|
|
12
|
+
/**
|
|
13
|
+
* The ScrollView element.
|
|
14
|
+
*/
|
|
15
|
+
element: HTMLDivElement | null;
|
|
16
|
+
/**
|
|
17
|
+
* Focus the ScrollView.
|
|
18
|
+
*/
|
|
19
|
+
focus: () => void;
|
|
20
|
+
}
|
|
21
|
+
/**
|
|
22
|
+
* @hidden
|
|
23
|
+
*/
|
|
24
|
+
export interface ScrollViewState {
|
|
25
|
+
timeoutRef: any;
|
|
26
|
+
}
|
|
27
|
+
/**
|
|
28
|
+
* @hidden
|
|
29
|
+
*/
|
|
30
|
+
export interface ScrollViewComputed {
|
|
31
|
+
[key: string]: any;
|
|
32
|
+
scrollViewClasses: object;
|
|
33
|
+
}
|
|
34
|
+
/**
|
|
35
|
+
* @hidden
|
|
36
|
+
*/
|
|
37
|
+
export interface ScrollViewMethods {
|
|
38
|
+
[key: string]: any;
|
|
39
|
+
}
|
|
40
|
+
/**
|
|
41
|
+
* @hidden
|
|
42
|
+
*/
|
|
43
|
+
export interface ScrollViewData {
|
|
44
|
+
active: number;
|
|
45
|
+
currentDir?: string;
|
|
46
|
+
}
|
|
47
|
+
/**
|
|
48
|
+
* @hidden
|
|
49
|
+
*/
|
|
50
|
+
export interface ScrollViewAll extends Vue, ScrollViewMethods, ScrollViewData, ScrollViewComputed, ScrollViewState {
|
|
51
|
+
}
|
|
52
|
+
declare let ScrollViewVue2: ComponentOptions<ScrollViewAll, DefaultData<ScrollViewData>, DefaultMethods<ScrollViewAll>, ScrollViewComputed, RecordPropsDefinition<ScrollViewProps>>;
|
|
53
|
+
declare const ScrollView: DefineComponent<ScrollViewProps, any, ScrollViewData, ScrollViewComputed, ScrollViewMethods, {}, {}, {}, string, ScrollViewProps, ScrollViewProps, {}>;
|
|
54
|
+
export { ScrollView, ScrollViewVue2 };
|
|
@@ -0,0 +1,295 @@
|
|
|
1
|
+
// @ts-ignore
|
|
2
|
+
import * as Vue from 'vue';
|
|
3
|
+
var allVue = Vue;
|
|
4
|
+
var gh = allVue.h;
|
|
5
|
+
import { classNames, getListeners, getTemplate, isRtl, Keys, templateRendering, validatePackage } from '@progress/kendo-vue-common';
|
|
6
|
+
import { packageMetadata } from './package-metadata'; // tslint:enable:max-line-length
|
|
7
|
+
|
|
8
|
+
var ScrollViewVue2 = {
|
|
9
|
+
name: 'KendoScrollView',
|
|
10
|
+
props: {
|
|
11
|
+
activeView: {
|
|
12
|
+
type: Number,
|
|
13
|
+
default: 1
|
|
14
|
+
},
|
|
15
|
+
dataItems: {
|
|
16
|
+
type: Array,
|
|
17
|
+
default: function _default() {
|
|
18
|
+
return [];
|
|
19
|
+
}
|
|
20
|
+
},
|
|
21
|
+
arrows: {
|
|
22
|
+
type: Boolean,
|
|
23
|
+
default: true
|
|
24
|
+
},
|
|
25
|
+
automaticViewChange: {
|
|
26
|
+
type: Boolean,
|
|
27
|
+
default: true
|
|
28
|
+
},
|
|
29
|
+
automaticViewChangeInterval: {
|
|
30
|
+
type: Number,
|
|
31
|
+
default: 5000
|
|
32
|
+
},
|
|
33
|
+
content: [Object, String, Function],
|
|
34
|
+
dir: String,
|
|
35
|
+
endless: Boolean,
|
|
36
|
+
pageable: {
|
|
37
|
+
type: Boolean,
|
|
38
|
+
default: true
|
|
39
|
+
},
|
|
40
|
+
pagerOverlay: {
|
|
41
|
+
type: String,
|
|
42
|
+
default: 'none'
|
|
43
|
+
}
|
|
44
|
+
},
|
|
45
|
+
created: function created() {
|
|
46
|
+
validatePackage(packageMetadata);
|
|
47
|
+
this.timeoutRef = null;
|
|
48
|
+
},
|
|
49
|
+
mounted: function mounted() {
|
|
50
|
+
this.wrapElement = this.v3 ? this.wrapElementRef : this.$refs.wrapElement;
|
|
51
|
+
this.currentDir = this.$props.dir !== undefined ? this.$props.dir : isRtl(this.$el) ? 'rtl' : 'ltr';
|
|
52
|
+
this.runAutomaticChange();
|
|
53
|
+
},
|
|
54
|
+
updated: function updated() {
|
|
55
|
+
var viewsCount = this.dataItems.length;
|
|
56
|
+
|
|
57
|
+
if (this.wrapElement) {
|
|
58
|
+
this.wrapElement.style.setProperty('--kendo-scrollview-views', "" + viewsCount);
|
|
59
|
+
this.wrapElement.style.setProperty('--kendo-scrollview-current', "" + this.active);
|
|
60
|
+
}
|
|
61
|
+
|
|
62
|
+
this.runAutomaticChange();
|
|
63
|
+
},
|
|
64
|
+
data: function data() {
|
|
65
|
+
return {
|
|
66
|
+
active: this.activeView || 1,
|
|
67
|
+
currentDir: undefined
|
|
68
|
+
};
|
|
69
|
+
},
|
|
70
|
+
computed: {
|
|
71
|
+
scrollViewClasses: function scrollViewClasses() {
|
|
72
|
+
return {
|
|
73
|
+
'k-widget': true,
|
|
74
|
+
'k-scrollview': true,
|
|
75
|
+
'k-scrollview-light': this.pagerOverlay === 'light',
|
|
76
|
+
'k-scrollview-dark': this.pagerOverlay === 'dark'
|
|
77
|
+
};
|
|
78
|
+
},
|
|
79
|
+
displayLeftArrow: function displayLeftArrow() {
|
|
80
|
+
var isNotBorderItem;
|
|
81
|
+
|
|
82
|
+
if (this.isRtl) {
|
|
83
|
+
isNotBorderItem = this.active < this.dataItems.length;
|
|
84
|
+
} else {
|
|
85
|
+
isNotBorderItem = this.active > 1;
|
|
86
|
+
}
|
|
87
|
+
|
|
88
|
+
return (this.endless || isNotBorderItem) && this.dataItems.length > 0;
|
|
89
|
+
},
|
|
90
|
+
displayRightArrow: function displayRightArrow() {
|
|
91
|
+
var isNotBorderItem;
|
|
92
|
+
|
|
93
|
+
if (this.isRtl) {
|
|
94
|
+
isNotBorderItem = this.active > 1;
|
|
95
|
+
} else {
|
|
96
|
+
isNotBorderItem = this.active < this.dataItems.length;
|
|
97
|
+
}
|
|
98
|
+
|
|
99
|
+
return (this.endless || isNotBorderItem) && this.dataItems.length > 0;
|
|
100
|
+
},
|
|
101
|
+
isRtl: function isRtl() {
|
|
102
|
+
return this.currentDir === 'rtl';
|
|
103
|
+
}
|
|
104
|
+
},
|
|
105
|
+
// @ts-ignore
|
|
106
|
+
setup: !gh ? undefined : function () {
|
|
107
|
+
var v3 = !!gh;
|
|
108
|
+
return {
|
|
109
|
+
v3: v3
|
|
110
|
+
};
|
|
111
|
+
},
|
|
112
|
+
// @ts-ignore
|
|
113
|
+
render: function render(createElement) {
|
|
114
|
+
var _this = this;
|
|
115
|
+
|
|
116
|
+
var h = gh || createElement;
|
|
117
|
+
var _a = this.$props,
|
|
118
|
+
pageable = _a.pageable,
|
|
119
|
+
arrows = _a.arrows,
|
|
120
|
+
content = _a.content;
|
|
121
|
+
var viewsCount = this.dataItems.length;
|
|
122
|
+
var allContent = this.dataItems.map(function (item, index) {
|
|
123
|
+
var contentTemplate = templateRendering.call(this, item.content || content, getListeners.call(this));
|
|
124
|
+
var contentRender = getTemplate.call(this, {
|
|
125
|
+
h: h,
|
|
126
|
+
template: contentTemplate,
|
|
127
|
+
defaultRendering: null,
|
|
128
|
+
additionalProps: {
|
|
129
|
+
item: item,
|
|
130
|
+
items: this.dataItems
|
|
131
|
+
}
|
|
132
|
+
});
|
|
133
|
+
return h("div", {
|
|
134
|
+
"class": "k-scrollview-view",
|
|
135
|
+
"aria-hidden": this.active === index + 1 ? false : true,
|
|
136
|
+
attrs: this.v3 ? undefined : {
|
|
137
|
+
"aria-hidden": this.active === index + 1 ? false : true
|
|
138
|
+
}
|
|
139
|
+
}, [contentRender]);
|
|
140
|
+
}, this);
|
|
141
|
+
return h("div", {
|
|
142
|
+
"class": this.scrollViewClasses,
|
|
143
|
+
tabIndex: 0,
|
|
144
|
+
attrs: this.v3 ? undefined : {
|
|
145
|
+
tabIndex: 0,
|
|
146
|
+
dir: this.currentDir
|
|
147
|
+
},
|
|
148
|
+
dir: this.currentDir,
|
|
149
|
+
onKeydown: this.handleKeyDown,
|
|
150
|
+
on: this.v3 ? undefined : {
|
|
151
|
+
"keydown": this.handleKeyDown
|
|
152
|
+
}
|
|
153
|
+
}, [h("div", {
|
|
154
|
+
"class": "k-scrollview-wrap k-scrollview-animate",
|
|
155
|
+
style: "--kendo-scrollview-views:" + viewsCount + "; --kendo-scrollview-current:" + this.active + ";",
|
|
156
|
+
ref: this.v3 ? function (el) {
|
|
157
|
+
_this.wrapElementRef = el;
|
|
158
|
+
} : 'wrapElement'
|
|
159
|
+
}, [allContent]), h("div", {
|
|
160
|
+
"class": "k-scrollview-elements"
|
|
161
|
+
}, [arrows && [this.displayLeftArrow && h("a", {
|
|
162
|
+
"class": "k-scrollview-prev",
|
|
163
|
+
"aria-label": "previous",
|
|
164
|
+
attrs: this.v3 ? undefined : {
|
|
165
|
+
"aria-label": "previous"
|
|
166
|
+
},
|
|
167
|
+
onClick: this.handlePrevClick,
|
|
168
|
+
on: this.v3 ? undefined : {
|
|
169
|
+
"click": this.handlePrevClick
|
|
170
|
+
}
|
|
171
|
+
}, [h("span", {
|
|
172
|
+
"class": "k-icon k-i-arrowhead-w"
|
|
173
|
+
})]), this.displayRightArrow && h("a", {
|
|
174
|
+
"class": "k-scrollview-next",
|
|
175
|
+
"aria-label": "next",
|
|
176
|
+
attrs: this.v3 ? undefined : {
|
|
177
|
+
"aria-label": "next"
|
|
178
|
+
},
|
|
179
|
+
onClick: this.handleNextClick,
|
|
180
|
+
on: this.v3 ? undefined : {
|
|
181
|
+
"click": this.handleNextClick
|
|
182
|
+
}
|
|
183
|
+
}, [h("span", {
|
|
184
|
+
"class": "k-icon k-i-arrowhead-e"
|
|
185
|
+
})])], pageable && h("div", {
|
|
186
|
+
"class": "k-scrollview-nav-wrap"
|
|
187
|
+
}, [h("ul", {
|
|
188
|
+
"class": "k-scrollview-nav"
|
|
189
|
+
}, [this.dataItems.map(function (_, index) {
|
|
190
|
+
var _this = this;
|
|
191
|
+
|
|
192
|
+
return h("li", {
|
|
193
|
+
"class": classNames('k-link', {
|
|
194
|
+
'k-primary': this.active === index + 1
|
|
195
|
+
}),
|
|
196
|
+
key: index + 1,
|
|
197
|
+
onClick: function onClick() {
|
|
198
|
+
return _this.setActive(index + 1);
|
|
199
|
+
},
|
|
200
|
+
on: this.v3 ? undefined : {
|
|
201
|
+
"click": function onClick() {
|
|
202
|
+
return _this.setActive(index + 1);
|
|
203
|
+
}
|
|
204
|
+
}
|
|
205
|
+
});
|
|
206
|
+
}, this)])])])]);
|
|
207
|
+
},
|
|
208
|
+
methods: {
|
|
209
|
+
runAutomaticChange: function runAutomaticChange() {
|
|
210
|
+
if (this.automaticViewChange) {
|
|
211
|
+
this.resetTimeout();
|
|
212
|
+
var that_1 = this;
|
|
213
|
+
var prevIndex_1 = this.active;
|
|
214
|
+
this.timeoutRef = setTimeout(function () {
|
|
215
|
+
that_1.setActive(prevIndex_1 === that_1.dataItems.length ? that_1.endless ? 1 : prevIndex_1 : prevIndex_1 + 1);
|
|
216
|
+
}, this.automaticViewChangeInterval);
|
|
217
|
+
}
|
|
218
|
+
},
|
|
219
|
+
resetTimeout: function resetTimeout() {
|
|
220
|
+
if (this.timeoutRef) {
|
|
221
|
+
clearTimeout(this.timeoutRef);
|
|
222
|
+
}
|
|
223
|
+
},
|
|
224
|
+
setActive: function setActive(value) {
|
|
225
|
+
this.active = value;
|
|
226
|
+
},
|
|
227
|
+
focusElement: function focusElement() {
|
|
228
|
+
if (this.$el) {
|
|
229
|
+
this.$el.focus();
|
|
230
|
+
}
|
|
231
|
+
},
|
|
232
|
+
prev: function prev() {
|
|
233
|
+
if (!this.endless) {
|
|
234
|
+
if (this.active > 1) {
|
|
235
|
+
this.setActive(this.active - 1);
|
|
236
|
+
}
|
|
237
|
+
} else {
|
|
238
|
+
this.active > 1 ? this.setActive(this.active - 1) : this.setActive(this.dataItems.length);
|
|
239
|
+
}
|
|
240
|
+
},
|
|
241
|
+
next: function next() {
|
|
242
|
+
if (!this.endless) {
|
|
243
|
+
if (this.active < this.dataItems.length) {
|
|
244
|
+
this.setActive(this.active + 1);
|
|
245
|
+
}
|
|
246
|
+
} else {
|
|
247
|
+
this.active < this.dataItems.length ? this.setActive(this.active + 1) : this.setActive(1);
|
|
248
|
+
}
|
|
249
|
+
},
|
|
250
|
+
handlePrevClick: function handlePrevClick() {
|
|
251
|
+
if (!this.isRtl) {
|
|
252
|
+
this.prev();
|
|
253
|
+
} else {
|
|
254
|
+
this.next();
|
|
255
|
+
}
|
|
256
|
+
},
|
|
257
|
+
handleNextClick: function handleNextClick() {
|
|
258
|
+
if (!this.isRtl) {
|
|
259
|
+
this.next();
|
|
260
|
+
} else {
|
|
261
|
+
this.prev();
|
|
262
|
+
}
|
|
263
|
+
},
|
|
264
|
+
handleKeyDown: function handleKeyDown(event) {
|
|
265
|
+
switch (event.keyCode) {
|
|
266
|
+
case Keys.left:
|
|
267
|
+
event.preventDefault();
|
|
268
|
+
|
|
269
|
+
if (!this.isRtl) {
|
|
270
|
+
this.prev();
|
|
271
|
+
} else {
|
|
272
|
+
this.next();
|
|
273
|
+
}
|
|
274
|
+
|
|
275
|
+
break;
|
|
276
|
+
|
|
277
|
+
case Keys.right:
|
|
278
|
+
event.preventDefault();
|
|
279
|
+
|
|
280
|
+
if (!this.isRtl) {
|
|
281
|
+
this.next();
|
|
282
|
+
} else {
|
|
283
|
+
this.prev();
|
|
284
|
+
}
|
|
285
|
+
|
|
286
|
+
break;
|
|
287
|
+
|
|
288
|
+
default:
|
|
289
|
+
break;
|
|
290
|
+
}
|
|
291
|
+
}
|
|
292
|
+
}
|
|
293
|
+
};
|
|
294
|
+
var ScrollView = ScrollViewVue2;
|
|
295
|
+
export { ScrollView, ScrollViewVue2 };
|
|
@@ -0,0 +1,54 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Represents the props of the [KendoReact ScrollView component]({% slug overview_scrollview %}).
|
|
3
|
+
*/
|
|
4
|
+
export interface ScrollViewProps {
|
|
5
|
+
/**
|
|
6
|
+
* Represents the current active view ([see example]({% slug activeview_scrollview %})). Defaults to `1`.
|
|
7
|
+
*/
|
|
8
|
+
activeView?: number;
|
|
9
|
+
/**
|
|
10
|
+
* Enables or disables the built-in navigation arrows ([see example]({% slug arrows_scrollview %})). Defaults to `true`.
|
|
11
|
+
*/
|
|
12
|
+
arrows?: boolean;
|
|
13
|
+
/**
|
|
14
|
+
* Allows the ScrollView to switch the next page automatically after a short delay ([see example]({% slug automatic_scrolling_scrollview %})).
|
|
15
|
+
* Defaults to `true`.
|
|
16
|
+
*/
|
|
17
|
+
automaticViewChange?: boolean;
|
|
18
|
+
/**
|
|
19
|
+
* Defines the automatic page change delay in milliseconds ([see example]({% slug automatic_scrolling_scrollview %})).
|
|
20
|
+
* Defaults to `5000`.
|
|
21
|
+
*/
|
|
22
|
+
automaticViewChangeInterval?: number;
|
|
23
|
+
/**
|
|
24
|
+
* Content Template for the ScrollView items.
|
|
25
|
+
*/
|
|
26
|
+
content?: any;
|
|
27
|
+
/**
|
|
28
|
+
* An array of the items that are passed to the ScrollView component.
|
|
29
|
+
*/
|
|
30
|
+
dataItems?: any[];
|
|
31
|
+
/**
|
|
32
|
+
* Represents the `dir` HTML attribute. This is used to switch from LTR to RTL.
|
|
33
|
+
*/
|
|
34
|
+
dir?: string;
|
|
35
|
+
/**
|
|
36
|
+
* Toggles the endless scrolling mode in which the data items are endlessly looped
|
|
37
|
+
* ([see example]({% slug endlessscrolling_scrollview %})). Defaults to `false`.
|
|
38
|
+
*/
|
|
39
|
+
endless?: boolean;
|
|
40
|
+
/**
|
|
41
|
+
* Toggles the built-in pager ([see example]({% slug paging_scrollview %})). Defaults to `true`.
|
|
42
|
+
*/
|
|
43
|
+
pageable?: boolean;
|
|
44
|
+
/**
|
|
45
|
+
* Sets the pager overlay ([see example]({% slug paging_scrollview %})).
|
|
46
|
+
*
|
|
47
|
+
* * The possible values are:
|
|
48
|
+
* * `none`(Default) — No overlay is set.
|
|
49
|
+
* * `dark` — Dark overlay is set.
|
|
50
|
+
* * `light` — Light overlay is set.
|
|
51
|
+
*
|
|
52
|
+
*/
|
|
53
|
+
pagerOverlay?: 'dark' | 'light' | 'none' | string;
|
|
54
|
+
}
|
|
File without changes
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
// @ts-ignore
|
|
2
|
+
import { DefineComponent } from 'vue';
|
|
3
|
+
// @ts-ignore
|
|
4
|
+
import * as Vue from 'vue';
|
|
5
|
+
// @ts-ignore
|
|
6
|
+
type Vue2type = Vue.default;
|
|
7
|
+
// @ts-ignore
|
|
8
|
+
import { RecordPropsDefinition, ComponentOptions } from 'vue/types/options';
|
|
9
|
+
export { DefineComponent, RecordPropsDefinition, ComponentOptions, Vue2type };
|
package/dist/es/main.js
ADDED
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @hidden
|
|
3
|
+
*/
|
|
4
|
+
export var packageMetadata = {
|
|
5
|
+
name: '@progress/kendo-vue-scrollview',
|
|
6
|
+
productName: 'Kendo UI for Vue',
|
|
7
|
+
productCodes: ['KENDOUIVUE', 'KENDOUICOMPLETE'],
|
|
8
|
+
publishDate: 1650379628,
|
|
9
|
+
version: '',
|
|
10
|
+
licensingDocsUrl: 'https://www.telerik.com/kendo-vue-ui/my-license/?utm_medium=product&utm_source=kendovue&utm_campaign=kendo-ui-vue-purchase-license-keys-warning'
|
|
11
|
+
};
|
|
@@ -0,0 +1,54 @@
|
|
|
1
|
+
import { DefineComponent } from './additionalTypes';
|
|
2
|
+
import { RecordPropsDefinition, ComponentOptions } from 'vue/types/options';
|
|
3
|
+
declare type DefaultData<V> = object | ((this: V) => {});
|
|
4
|
+
declare type DefaultMethods<V> = {
|
|
5
|
+
[key: string]: (this: V, ...args: any[]) => any;
|
|
6
|
+
};
|
|
7
|
+
import { ScrollViewProps } from './ScrollViewProps';
|
|
8
|
+
/**
|
|
9
|
+
* The ScrollView ref.
|
|
10
|
+
*/
|
|
11
|
+
export interface ScrollViewHandle {
|
|
12
|
+
/**
|
|
13
|
+
* The ScrollView element.
|
|
14
|
+
*/
|
|
15
|
+
element: HTMLDivElement | null;
|
|
16
|
+
/**
|
|
17
|
+
* Focus the ScrollView.
|
|
18
|
+
*/
|
|
19
|
+
focus: () => void;
|
|
20
|
+
}
|
|
21
|
+
/**
|
|
22
|
+
* @hidden
|
|
23
|
+
*/
|
|
24
|
+
export interface ScrollViewState {
|
|
25
|
+
timeoutRef: any;
|
|
26
|
+
}
|
|
27
|
+
/**
|
|
28
|
+
* @hidden
|
|
29
|
+
*/
|
|
30
|
+
export interface ScrollViewComputed {
|
|
31
|
+
[key: string]: any;
|
|
32
|
+
scrollViewClasses: object;
|
|
33
|
+
}
|
|
34
|
+
/**
|
|
35
|
+
* @hidden
|
|
36
|
+
*/
|
|
37
|
+
export interface ScrollViewMethods {
|
|
38
|
+
[key: string]: any;
|
|
39
|
+
}
|
|
40
|
+
/**
|
|
41
|
+
* @hidden
|
|
42
|
+
*/
|
|
43
|
+
export interface ScrollViewData {
|
|
44
|
+
active: number;
|
|
45
|
+
currentDir?: string;
|
|
46
|
+
}
|
|
47
|
+
/**
|
|
48
|
+
* @hidden
|
|
49
|
+
*/
|
|
50
|
+
export interface ScrollViewAll extends Vue, ScrollViewMethods, ScrollViewData, ScrollViewComputed, ScrollViewState {
|
|
51
|
+
}
|
|
52
|
+
declare let ScrollViewVue2: ComponentOptions<ScrollViewAll, DefaultData<ScrollViewData>, DefaultMethods<ScrollViewAll>, ScrollViewComputed, RecordPropsDefinition<ScrollViewProps>>;
|
|
53
|
+
declare const ScrollView: DefineComponent<ScrollViewProps, any, ScrollViewData, ScrollViewComputed, ScrollViewMethods, {}, {}, {}, string, ScrollViewProps, ScrollViewProps, {}>;
|
|
54
|
+
export { ScrollView, ScrollViewVue2 };
|
|
@@ -0,0 +1,306 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.ScrollViewVue2 = exports.ScrollView = void 0; // @ts-ignore
|
|
7
|
+
|
|
8
|
+
var Vue = require("vue");
|
|
9
|
+
|
|
10
|
+
var allVue = Vue;
|
|
11
|
+
var gh = allVue.h;
|
|
12
|
+
|
|
13
|
+
var kendo_vue_common_1 = require("@progress/kendo-vue-common");
|
|
14
|
+
|
|
15
|
+
var package_metadata_1 = require("./package-metadata"); // tslint:enable:max-line-length
|
|
16
|
+
|
|
17
|
+
|
|
18
|
+
var ScrollViewVue2 = {
|
|
19
|
+
name: 'KendoScrollView',
|
|
20
|
+
props: {
|
|
21
|
+
activeView: {
|
|
22
|
+
type: Number,
|
|
23
|
+
default: 1
|
|
24
|
+
},
|
|
25
|
+
dataItems: {
|
|
26
|
+
type: Array,
|
|
27
|
+
default: function _default() {
|
|
28
|
+
return [];
|
|
29
|
+
}
|
|
30
|
+
},
|
|
31
|
+
arrows: {
|
|
32
|
+
type: Boolean,
|
|
33
|
+
default: true
|
|
34
|
+
},
|
|
35
|
+
automaticViewChange: {
|
|
36
|
+
type: Boolean,
|
|
37
|
+
default: true
|
|
38
|
+
},
|
|
39
|
+
automaticViewChangeInterval: {
|
|
40
|
+
type: Number,
|
|
41
|
+
default: 5000
|
|
42
|
+
},
|
|
43
|
+
content: [Object, String, Function],
|
|
44
|
+
dir: String,
|
|
45
|
+
endless: Boolean,
|
|
46
|
+
pageable: {
|
|
47
|
+
type: Boolean,
|
|
48
|
+
default: true
|
|
49
|
+
},
|
|
50
|
+
pagerOverlay: {
|
|
51
|
+
type: String,
|
|
52
|
+
default: 'none'
|
|
53
|
+
}
|
|
54
|
+
},
|
|
55
|
+
created: function created() {
|
|
56
|
+
kendo_vue_common_1.validatePackage(package_metadata_1.packageMetadata);
|
|
57
|
+
this.timeoutRef = null;
|
|
58
|
+
},
|
|
59
|
+
mounted: function mounted() {
|
|
60
|
+
this.wrapElement = this.v3 ? this.wrapElementRef : this.$refs.wrapElement;
|
|
61
|
+
this.currentDir = this.$props.dir !== undefined ? this.$props.dir : kendo_vue_common_1.isRtl(this.$el) ? 'rtl' : 'ltr';
|
|
62
|
+
this.runAutomaticChange();
|
|
63
|
+
},
|
|
64
|
+
updated: function updated() {
|
|
65
|
+
var viewsCount = this.dataItems.length;
|
|
66
|
+
|
|
67
|
+
if (this.wrapElement) {
|
|
68
|
+
this.wrapElement.style.setProperty('--kendo-scrollview-views', "" + viewsCount);
|
|
69
|
+
this.wrapElement.style.setProperty('--kendo-scrollview-current', "" + this.active);
|
|
70
|
+
}
|
|
71
|
+
|
|
72
|
+
this.runAutomaticChange();
|
|
73
|
+
},
|
|
74
|
+
data: function data() {
|
|
75
|
+
return {
|
|
76
|
+
active: this.activeView || 1,
|
|
77
|
+
currentDir: undefined
|
|
78
|
+
};
|
|
79
|
+
},
|
|
80
|
+
computed: {
|
|
81
|
+
scrollViewClasses: function scrollViewClasses() {
|
|
82
|
+
return {
|
|
83
|
+
'k-widget': true,
|
|
84
|
+
'k-scrollview': true,
|
|
85
|
+
'k-scrollview-light': this.pagerOverlay === 'light',
|
|
86
|
+
'k-scrollview-dark': this.pagerOverlay === 'dark'
|
|
87
|
+
};
|
|
88
|
+
},
|
|
89
|
+
displayLeftArrow: function displayLeftArrow() {
|
|
90
|
+
var isNotBorderItem;
|
|
91
|
+
|
|
92
|
+
if (this.isRtl) {
|
|
93
|
+
isNotBorderItem = this.active < this.dataItems.length;
|
|
94
|
+
} else {
|
|
95
|
+
isNotBorderItem = this.active > 1;
|
|
96
|
+
}
|
|
97
|
+
|
|
98
|
+
return (this.endless || isNotBorderItem) && this.dataItems.length > 0;
|
|
99
|
+
},
|
|
100
|
+
displayRightArrow: function displayRightArrow() {
|
|
101
|
+
var isNotBorderItem;
|
|
102
|
+
|
|
103
|
+
if (this.isRtl) {
|
|
104
|
+
isNotBorderItem = this.active > 1;
|
|
105
|
+
} else {
|
|
106
|
+
isNotBorderItem = this.active < this.dataItems.length;
|
|
107
|
+
}
|
|
108
|
+
|
|
109
|
+
return (this.endless || isNotBorderItem) && this.dataItems.length > 0;
|
|
110
|
+
},
|
|
111
|
+
isRtl: function isRtl() {
|
|
112
|
+
return this.currentDir === 'rtl';
|
|
113
|
+
}
|
|
114
|
+
},
|
|
115
|
+
// @ts-ignore
|
|
116
|
+
setup: !gh ? undefined : function () {
|
|
117
|
+
var v3 = !!gh;
|
|
118
|
+
return {
|
|
119
|
+
v3: v3
|
|
120
|
+
};
|
|
121
|
+
},
|
|
122
|
+
// @ts-ignore
|
|
123
|
+
render: function render(createElement) {
|
|
124
|
+
var _this = this;
|
|
125
|
+
|
|
126
|
+
var h = gh || createElement;
|
|
127
|
+
var _a = this.$props,
|
|
128
|
+
pageable = _a.pageable,
|
|
129
|
+
arrows = _a.arrows,
|
|
130
|
+
content = _a.content;
|
|
131
|
+
var viewsCount = this.dataItems.length;
|
|
132
|
+
var allContent = this.dataItems.map(function (item, index) {
|
|
133
|
+
var contentTemplate = kendo_vue_common_1.templateRendering.call(this, item.content || content, kendo_vue_common_1.getListeners.call(this));
|
|
134
|
+
var contentRender = kendo_vue_common_1.getTemplate.call(this, {
|
|
135
|
+
h: h,
|
|
136
|
+
template: contentTemplate,
|
|
137
|
+
defaultRendering: null,
|
|
138
|
+
additionalProps: {
|
|
139
|
+
item: item,
|
|
140
|
+
items: this.dataItems
|
|
141
|
+
}
|
|
142
|
+
});
|
|
143
|
+
return h("div", {
|
|
144
|
+
"class": "k-scrollview-view",
|
|
145
|
+
"aria-hidden": this.active === index + 1 ? false : true,
|
|
146
|
+
attrs: this.v3 ? undefined : {
|
|
147
|
+
"aria-hidden": this.active === index + 1 ? false : true
|
|
148
|
+
}
|
|
149
|
+
}, [contentRender]);
|
|
150
|
+
}, this);
|
|
151
|
+
return h("div", {
|
|
152
|
+
"class": this.scrollViewClasses,
|
|
153
|
+
tabIndex: 0,
|
|
154
|
+
attrs: this.v3 ? undefined : {
|
|
155
|
+
tabIndex: 0,
|
|
156
|
+
dir: this.currentDir
|
|
157
|
+
},
|
|
158
|
+
dir: this.currentDir,
|
|
159
|
+
onKeydown: this.handleKeyDown,
|
|
160
|
+
on: this.v3 ? undefined : {
|
|
161
|
+
"keydown": this.handleKeyDown
|
|
162
|
+
}
|
|
163
|
+
}, [h("div", {
|
|
164
|
+
"class": "k-scrollview-wrap k-scrollview-animate",
|
|
165
|
+
style: "--kendo-scrollview-views:" + viewsCount + "; --kendo-scrollview-current:" + this.active + ";",
|
|
166
|
+
ref: this.v3 ? function (el) {
|
|
167
|
+
_this.wrapElementRef = el;
|
|
168
|
+
} : 'wrapElement'
|
|
169
|
+
}, [allContent]), h("div", {
|
|
170
|
+
"class": "k-scrollview-elements"
|
|
171
|
+
}, [arrows && [this.displayLeftArrow && h("a", {
|
|
172
|
+
"class": "k-scrollview-prev",
|
|
173
|
+
"aria-label": "previous",
|
|
174
|
+
attrs: this.v3 ? undefined : {
|
|
175
|
+
"aria-label": "previous"
|
|
176
|
+
},
|
|
177
|
+
onClick: this.handlePrevClick,
|
|
178
|
+
on: this.v3 ? undefined : {
|
|
179
|
+
"click": this.handlePrevClick
|
|
180
|
+
}
|
|
181
|
+
}, [h("span", {
|
|
182
|
+
"class": "k-icon k-i-arrowhead-w"
|
|
183
|
+
})]), this.displayRightArrow && h("a", {
|
|
184
|
+
"class": "k-scrollview-next",
|
|
185
|
+
"aria-label": "next",
|
|
186
|
+
attrs: this.v3 ? undefined : {
|
|
187
|
+
"aria-label": "next"
|
|
188
|
+
},
|
|
189
|
+
onClick: this.handleNextClick,
|
|
190
|
+
on: this.v3 ? undefined : {
|
|
191
|
+
"click": this.handleNextClick
|
|
192
|
+
}
|
|
193
|
+
}, [h("span", {
|
|
194
|
+
"class": "k-icon k-i-arrowhead-e"
|
|
195
|
+
})])], pageable && h("div", {
|
|
196
|
+
"class": "k-scrollview-nav-wrap"
|
|
197
|
+
}, [h("ul", {
|
|
198
|
+
"class": "k-scrollview-nav"
|
|
199
|
+
}, [this.dataItems.map(function (_, index) {
|
|
200
|
+
var _this = this;
|
|
201
|
+
|
|
202
|
+
return h("li", {
|
|
203
|
+
"class": kendo_vue_common_1.classNames('k-link', {
|
|
204
|
+
'k-primary': this.active === index + 1
|
|
205
|
+
}),
|
|
206
|
+
key: index + 1,
|
|
207
|
+
onClick: function onClick() {
|
|
208
|
+
return _this.setActive(index + 1);
|
|
209
|
+
},
|
|
210
|
+
on: this.v3 ? undefined : {
|
|
211
|
+
"click": function onClick() {
|
|
212
|
+
return _this.setActive(index + 1);
|
|
213
|
+
}
|
|
214
|
+
}
|
|
215
|
+
});
|
|
216
|
+
}, this)])])])]);
|
|
217
|
+
},
|
|
218
|
+
methods: {
|
|
219
|
+
runAutomaticChange: function runAutomaticChange() {
|
|
220
|
+
if (this.automaticViewChange) {
|
|
221
|
+
this.resetTimeout();
|
|
222
|
+
var that_1 = this;
|
|
223
|
+
var prevIndex_1 = this.active;
|
|
224
|
+
this.timeoutRef = setTimeout(function () {
|
|
225
|
+
that_1.setActive(prevIndex_1 === that_1.dataItems.length ? that_1.endless ? 1 : prevIndex_1 : prevIndex_1 + 1);
|
|
226
|
+
}, this.automaticViewChangeInterval);
|
|
227
|
+
}
|
|
228
|
+
},
|
|
229
|
+
resetTimeout: function resetTimeout() {
|
|
230
|
+
if (this.timeoutRef) {
|
|
231
|
+
clearTimeout(this.timeoutRef);
|
|
232
|
+
}
|
|
233
|
+
},
|
|
234
|
+
setActive: function setActive(value) {
|
|
235
|
+
this.active = value;
|
|
236
|
+
},
|
|
237
|
+
focusElement: function focusElement() {
|
|
238
|
+
if (this.$el) {
|
|
239
|
+
this.$el.focus();
|
|
240
|
+
}
|
|
241
|
+
},
|
|
242
|
+
prev: function prev() {
|
|
243
|
+
if (!this.endless) {
|
|
244
|
+
if (this.active > 1) {
|
|
245
|
+
this.setActive(this.active - 1);
|
|
246
|
+
}
|
|
247
|
+
} else {
|
|
248
|
+
this.active > 1 ? this.setActive(this.active - 1) : this.setActive(this.dataItems.length);
|
|
249
|
+
}
|
|
250
|
+
},
|
|
251
|
+
next: function next() {
|
|
252
|
+
if (!this.endless) {
|
|
253
|
+
if (this.active < this.dataItems.length) {
|
|
254
|
+
this.setActive(this.active + 1);
|
|
255
|
+
}
|
|
256
|
+
} else {
|
|
257
|
+
this.active < this.dataItems.length ? this.setActive(this.active + 1) : this.setActive(1);
|
|
258
|
+
}
|
|
259
|
+
},
|
|
260
|
+
handlePrevClick: function handlePrevClick() {
|
|
261
|
+
if (!this.isRtl) {
|
|
262
|
+
this.prev();
|
|
263
|
+
} else {
|
|
264
|
+
this.next();
|
|
265
|
+
}
|
|
266
|
+
},
|
|
267
|
+
handleNextClick: function handleNextClick() {
|
|
268
|
+
if (!this.isRtl) {
|
|
269
|
+
this.next();
|
|
270
|
+
} else {
|
|
271
|
+
this.prev();
|
|
272
|
+
}
|
|
273
|
+
},
|
|
274
|
+
handleKeyDown: function handleKeyDown(event) {
|
|
275
|
+
switch (event.keyCode) {
|
|
276
|
+
case kendo_vue_common_1.Keys.left:
|
|
277
|
+
event.preventDefault();
|
|
278
|
+
|
|
279
|
+
if (!this.isRtl) {
|
|
280
|
+
this.prev();
|
|
281
|
+
} else {
|
|
282
|
+
this.next();
|
|
283
|
+
}
|
|
284
|
+
|
|
285
|
+
break;
|
|
286
|
+
|
|
287
|
+
case kendo_vue_common_1.Keys.right:
|
|
288
|
+
event.preventDefault();
|
|
289
|
+
|
|
290
|
+
if (!this.isRtl) {
|
|
291
|
+
this.next();
|
|
292
|
+
} else {
|
|
293
|
+
this.prev();
|
|
294
|
+
}
|
|
295
|
+
|
|
296
|
+
break;
|
|
297
|
+
|
|
298
|
+
default:
|
|
299
|
+
break;
|
|
300
|
+
}
|
|
301
|
+
}
|
|
302
|
+
}
|
|
303
|
+
};
|
|
304
|
+
exports.ScrollViewVue2 = ScrollViewVue2;
|
|
305
|
+
var ScrollView = ScrollViewVue2;
|
|
306
|
+
exports.ScrollView = ScrollView;
|
|
@@ -0,0 +1,54 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Represents the props of the [KendoReact ScrollView component]({% slug overview_scrollview %}).
|
|
3
|
+
*/
|
|
4
|
+
export interface ScrollViewProps {
|
|
5
|
+
/**
|
|
6
|
+
* Represents the current active view ([see example]({% slug activeview_scrollview %})). Defaults to `1`.
|
|
7
|
+
*/
|
|
8
|
+
activeView?: number;
|
|
9
|
+
/**
|
|
10
|
+
* Enables or disables the built-in navigation arrows ([see example]({% slug arrows_scrollview %})). Defaults to `true`.
|
|
11
|
+
*/
|
|
12
|
+
arrows?: boolean;
|
|
13
|
+
/**
|
|
14
|
+
* Allows the ScrollView to switch the next page automatically after a short delay ([see example]({% slug automatic_scrolling_scrollview %})).
|
|
15
|
+
* Defaults to `true`.
|
|
16
|
+
*/
|
|
17
|
+
automaticViewChange?: boolean;
|
|
18
|
+
/**
|
|
19
|
+
* Defines the automatic page change delay in milliseconds ([see example]({% slug automatic_scrolling_scrollview %})).
|
|
20
|
+
* Defaults to `5000`.
|
|
21
|
+
*/
|
|
22
|
+
automaticViewChangeInterval?: number;
|
|
23
|
+
/**
|
|
24
|
+
* Content Template for the ScrollView items.
|
|
25
|
+
*/
|
|
26
|
+
content?: any;
|
|
27
|
+
/**
|
|
28
|
+
* An array of the items that are passed to the ScrollView component.
|
|
29
|
+
*/
|
|
30
|
+
dataItems?: any[];
|
|
31
|
+
/**
|
|
32
|
+
* Represents the `dir` HTML attribute. This is used to switch from LTR to RTL.
|
|
33
|
+
*/
|
|
34
|
+
dir?: string;
|
|
35
|
+
/**
|
|
36
|
+
* Toggles the endless scrolling mode in which the data items are endlessly looped
|
|
37
|
+
* ([see example]({% slug endlessscrolling_scrollview %})). Defaults to `false`.
|
|
38
|
+
*/
|
|
39
|
+
endless?: boolean;
|
|
40
|
+
/**
|
|
41
|
+
* Toggles the built-in pager ([see example]({% slug paging_scrollview %})). Defaults to `true`.
|
|
42
|
+
*/
|
|
43
|
+
pageable?: boolean;
|
|
44
|
+
/**
|
|
45
|
+
* Sets the pager overlay ([see example]({% slug paging_scrollview %})).
|
|
46
|
+
*
|
|
47
|
+
* * The possible values are:
|
|
48
|
+
* * `none`(Default) — No overlay is set.
|
|
49
|
+
* * `dark` — Dark overlay is set.
|
|
50
|
+
* * `light` — Light overlay is set.
|
|
51
|
+
*
|
|
52
|
+
*/
|
|
53
|
+
pagerOverlay?: 'dark' | 'light' | 'none' | string;
|
|
54
|
+
}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
// @ts-ignore
|
|
2
|
+
import { DefineComponent } from 'vue';
|
|
3
|
+
// @ts-ignore
|
|
4
|
+
import * as Vue from 'vue';
|
|
5
|
+
// @ts-ignore
|
|
6
|
+
type Vue2type = Vue.default;
|
|
7
|
+
// @ts-ignore
|
|
8
|
+
import { RecordPropsDefinition, ComponentOptions } from 'vue/types/options';
|
|
9
|
+
export { DefineComponent, RecordPropsDefinition, ComponentOptions, Vue2type };
|
package/dist/npm/main.js
ADDED
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
+
if (k2 === undefined) k2 = k;
|
|
4
|
+
Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
|
|
5
|
+
}) : (function(o, m, k, k2) {
|
|
6
|
+
if (k2 === undefined) k2 = k;
|
|
7
|
+
o[k2] = m[k];
|
|
8
|
+
}));
|
|
9
|
+
var __exportStar = (this && this.__exportStar) || function(m, exports) {
|
|
10
|
+
for (var p in m) if (p !== "default" && !exports.hasOwnProperty(p)) __createBinding(exports, m, p);
|
|
11
|
+
};
|
|
12
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
13
|
+
__exportStar(require("./ScrollView"), exports);
|
|
14
|
+
__exportStar(require("./ScrollViewProps"), exports);
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.packageMetadata = void 0;
|
|
4
|
+
/**
|
|
5
|
+
* @hidden
|
|
6
|
+
*/
|
|
7
|
+
exports.packageMetadata = {
|
|
8
|
+
name: '@progress/kendo-vue-scrollview',
|
|
9
|
+
productName: 'Kendo UI for Vue',
|
|
10
|
+
productCodes: ['KENDOUIVUE', 'KENDOUICOMPLETE'],
|
|
11
|
+
publishDate: 1650379628,
|
|
12
|
+
version: '',
|
|
13
|
+
licensingDocsUrl: 'https://www.telerik.com/kendo-vue-ui/my-license/?utm_medium=product&utm_source=kendovue&utm_campaign=kendo-ui-vue-purchase-license-keys-warning'
|
|
14
|
+
};
|
package/package.json
ADDED
|
@@ -0,0 +1,54 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@progress/kendo-vue-scrollview",
|
|
3
|
+
"description": "Kendo UI for Vue ScrollView package",
|
|
4
|
+
"version": "3.2.3-dev.202204191450",
|
|
5
|
+
"repository": {
|
|
6
|
+
"type": "git",
|
|
7
|
+
"url": "https://github.com/telerik/kendo-vue.git"
|
|
8
|
+
},
|
|
9
|
+
"main": "dist/npm/main.js",
|
|
10
|
+
"types": "dist/npm/main.d.ts",
|
|
11
|
+
"module": "dist/es/main.js",
|
|
12
|
+
"jsnext:main": "dist/es/main.js",
|
|
13
|
+
"scripts": {
|
|
14
|
+
"test": "cd ../../ && npm run test -- --testPathPattern=/packages/scrollview/.*",
|
|
15
|
+
"start": "gulp start",
|
|
16
|
+
"build-package": "gulp build-package"
|
|
17
|
+
},
|
|
18
|
+
"homepage": "https://www.telerik.com/kendo-vue-ui/",
|
|
19
|
+
"keywords": [
|
|
20
|
+
"Kendo UI",
|
|
21
|
+
"Vue",
|
|
22
|
+
"Progress",
|
|
23
|
+
"ScrollView",
|
|
24
|
+
"Kendo UI for Vue",
|
|
25
|
+
"vuejs",
|
|
26
|
+
"UI",
|
|
27
|
+
"components",
|
|
28
|
+
"Vue component",
|
|
29
|
+
"Telerik"
|
|
30
|
+
],
|
|
31
|
+
"peerDependencies": {
|
|
32
|
+
"@progress/kendo-licensing": "^1.0.1"
|
|
33
|
+
},
|
|
34
|
+
"devDependencies": {
|
|
35
|
+
"@progress/kendo-drawing": "^1.8.0",
|
|
36
|
+
"@progress/kendo-licensing": "^1.0.1",
|
|
37
|
+
"@progress/kendo-vue-animation": "3.2.3-dev.202204191450",
|
|
38
|
+
"@progress/kendo-vue-buttons": "3.2.3-dev.202204191450",
|
|
39
|
+
"@progress/kendo-vue-inputs": "3.2.3-dev.202204191450",
|
|
40
|
+
"@progress/kendo-vue-intl": "3.2.3-dev.202204191450"
|
|
41
|
+
},
|
|
42
|
+
"dependencies": {
|
|
43
|
+
"@progress/kendo-vue-common": "3.2.3-dev.202204191450"
|
|
44
|
+
},
|
|
45
|
+
"@progress": {
|
|
46
|
+
"friendlyName": "ScrollView",
|
|
47
|
+
"framework": "Kendo UI for Vue"
|
|
48
|
+
},
|
|
49
|
+
"author": "Progress",
|
|
50
|
+
"license": "SEE LICENSE IN LICENSE.md",
|
|
51
|
+
"publishConfig": {
|
|
52
|
+
"access": "public"
|
|
53
|
+
}
|
|
54
|
+
}
|