@progress/kendo-vue-listbox 3.10.2 → 3.11.0-dev.202305230751

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.
@@ -6,27 +6,36 @@ var isV3 = allVue.version && allVue.version[0] === '3';
6
6
  import { Button } from '@progress/kendo-vue-buttons';
7
7
  import { provideLocalizationService } from '@progress/kendo-vue-intl';
8
8
  import { messages } from './messages/main';
9
+ import { isRtl } from '@progress/kendo-vue-common';
10
+ import { caretAltUpIcon, caretAltDownIcon, caretAltRightIcon, caretAltLeftIcon, caretDoubleAltRightIcon, caretDoubleAltLeftIcon, xIcon } from '@progress/kendo-svg-icons';
9
11
  var tools = [{
10
12
  name: 'moveUp',
11
- iconName: 'caret-alt-up'
13
+ iconName: 'caret-alt-up',
14
+ svgIcon: caretAltUpIcon
12
15
  }, {
13
16
  name: 'moveDown',
14
- iconName: 'caret-alt-down'
17
+ iconName: 'caret-alt-down',
18
+ svgIcon: caretAltDownIcon
15
19
  }, {
16
20
  name: 'transferTo',
17
- iconName: 'caret-alt-right'
21
+ iconName: 'caret-alt-right',
22
+ svgIcon: caretAltRightIcon
18
23
  }, {
19
24
  name: 'transferFrom',
20
- iconName: 'caret-alt-left'
25
+ iconName: 'caret-alt-left',
26
+ svgIcon: caretAltLeftIcon
21
27
  }, {
22
28
  name: 'transferAllTo',
23
- iconName: 'caret-double-alt-right'
29
+ iconName: 'caret-double-alt-right',
30
+ svgIcon: caretDoubleAltRightIcon
24
31
  }, {
25
32
  name: 'transferAllFrom',
26
- iconName: 'caret-double-alt-left'
33
+ iconName: 'caret-double-alt-left',
34
+ svgIcon: caretDoubleAltLeftIcon
27
35
  }, {
28
36
  name: 'remove',
29
- iconName: 'x'
37
+ iconName: 'x',
38
+ svgIcon: xIcon
30
39
  }];
31
40
  /**
32
41
  * @hidden
@@ -47,6 +56,14 @@ var ListBoxToolbarVue2 = {
47
56
  default: null
48
57
  }
49
58
  },
59
+ data: function data() {
60
+ return {
61
+ currentRtl: false
62
+ };
63
+ },
64
+ mounted: function mounted() {
65
+ this.currentRtl = isRtl(this.$el);
66
+ },
50
67
  // @ts-ignore
51
68
  setup: !isV3 ? undefined : function () {
52
69
  var v3 = !!isV3;
@@ -77,12 +94,14 @@ var ListBoxToolbarVue2 = {
77
94
  "data-command": currentTool.name,
78
95
  title: title,
79
96
  "aria-label": title,
80
- icon: currentTool.iconName
97
+ icon: this.isRtl ? this.getRtlFontIcon(currentTool.iconName) : currentTool.iconName,
98
+ svgIcon: this.isRtl ? this.getRtlSvgIcon(currentTool.svgIcon) : currentTool.svgIcon
81
99
  },
82
100
  "data-command": currentTool.name,
83
101
  title: title,
84
102
  "aria-label": title,
85
- icon: currentTool.iconName,
103
+ icon: this.isRtl ? this.getRtlFontIcon(currentTool.iconName) : currentTool.iconName,
104
+ svgIcon: this.isRtl ? this.getRtlSvgIcon(currentTool.svgIcon) : currentTool.svgIcon,
86
105
  onClick: function onClick(e) {
87
106
  e.preventDefault();
88
107
  _this.handleToolClick(e, currentTool.name || null);
@@ -97,6 +116,34 @@ var ListBoxToolbarVue2 = {
97
116
  }, this)]);
98
117
  },
99
118
  methods: {
119
+ getRtlSvgIcon: function getRtlSvgIcon(toolIcon) {
120
+ switch (toolIcon.name) {
121
+ case 'caret-alt-right':
122
+ return caretAltLeftIcon;
123
+ case 'caret-alt-left':
124
+ return caretAltRightIcon;
125
+ case 'caret-double-alt-right':
126
+ return caretDoubleAltLeftIcon;
127
+ case 'caret-double-alt-left':
128
+ return caretDoubleAltRightIcon;
129
+ default:
130
+ }
131
+ return toolIcon;
132
+ },
133
+ getRtlFontIcon: function getRtlFontIcon(toolIcon) {
134
+ switch (toolIcon) {
135
+ case 'caret-alt-right':
136
+ return 'caret-alt-left';
137
+ case 'caret-alt-left':
138
+ return 'caret-alt-right';
139
+ case 'caret-double-alt-right':
140
+ return 'caret-double-alt-left';
141
+ case 'caret-double-alt-left':
142
+ return 'caret-double-alt-right';
143
+ default:
144
+ }
145
+ return toolIcon;
146
+ },
100
147
  handleToolClick: function handleToolClick(event, name) {
101
148
  this.$emit('toolclick', {
102
149
  event: event,
@@ -5,7 +5,7 @@ export var packageMetadata = {
5
5
  name: '@progress/kendo-vue-listbox',
6
6
  productName: 'Kendo UI for Vue',
7
7
  productCodes: ['KENDOUIVUE', 'KENDOUICOMPLETE'],
8
- publishDate: 1684762963,
8
+ publishDate: 1684828018,
9
9
  version: '',
10
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
11
  };
@@ -6,27 +6,36 @@ var isV3 = allVue.version && allVue.version[0] === '3';
6
6
  import { Button } from '@progress/kendo-vue-buttons';
7
7
  import { provideLocalizationService } from '@progress/kendo-vue-intl';
8
8
  import { messages } from './messages/main.js';
9
+ import { isRtl } from '@progress/kendo-vue-common';
10
+ import { caretAltUpIcon, caretAltDownIcon, caretAltRightIcon, caretAltLeftIcon, caretDoubleAltRightIcon, caretDoubleAltLeftIcon, xIcon } from '@progress/kendo-svg-icons';
9
11
  var tools = [{
10
12
  name: 'moveUp',
11
- iconName: 'caret-alt-up'
13
+ iconName: 'caret-alt-up',
14
+ svgIcon: caretAltUpIcon
12
15
  }, {
13
16
  name: 'moveDown',
14
- iconName: 'caret-alt-down'
17
+ iconName: 'caret-alt-down',
18
+ svgIcon: caretAltDownIcon
15
19
  }, {
16
20
  name: 'transferTo',
17
- iconName: 'caret-alt-right'
21
+ iconName: 'caret-alt-right',
22
+ svgIcon: caretAltRightIcon
18
23
  }, {
19
24
  name: 'transferFrom',
20
- iconName: 'caret-alt-left'
25
+ iconName: 'caret-alt-left',
26
+ svgIcon: caretAltLeftIcon
21
27
  }, {
22
28
  name: 'transferAllTo',
23
- iconName: 'caret-double-alt-right'
29
+ iconName: 'caret-double-alt-right',
30
+ svgIcon: caretDoubleAltRightIcon
24
31
  }, {
25
32
  name: 'transferAllFrom',
26
- iconName: 'caret-double-alt-left'
33
+ iconName: 'caret-double-alt-left',
34
+ svgIcon: caretDoubleAltLeftIcon
27
35
  }, {
28
36
  name: 'remove',
29
- iconName: 'x'
37
+ iconName: 'x',
38
+ svgIcon: xIcon
30
39
  }];
31
40
  /**
32
41
  * @hidden
@@ -47,6 +56,14 @@ var ListBoxToolbarVue2 = {
47
56
  default: null
48
57
  }
49
58
  },
59
+ data: function data() {
60
+ return {
61
+ currentRtl: false
62
+ };
63
+ },
64
+ mounted: function mounted() {
65
+ this.currentRtl = isRtl(this.$el);
66
+ },
50
67
  // @ts-ignore
51
68
  setup: !isV3 ? undefined : function () {
52
69
  var v3 = !!isV3;
@@ -77,12 +94,14 @@ var ListBoxToolbarVue2 = {
77
94
  "data-command": currentTool.name,
78
95
  title: title,
79
96
  "aria-label": title,
80
- icon: currentTool.iconName
97
+ icon: this.isRtl ? this.getRtlFontIcon(currentTool.iconName) : currentTool.iconName,
98
+ svgIcon: this.isRtl ? this.getRtlSvgIcon(currentTool.svgIcon) : currentTool.svgIcon
81
99
  },
82
100
  "data-command": currentTool.name,
83
101
  title: title,
84
102
  "aria-label": title,
85
- icon: currentTool.iconName,
103
+ icon: this.isRtl ? this.getRtlFontIcon(currentTool.iconName) : currentTool.iconName,
104
+ svgIcon: this.isRtl ? this.getRtlSvgIcon(currentTool.svgIcon) : currentTool.svgIcon,
86
105
  onClick: function onClick(e) {
87
106
  e.preventDefault();
88
107
  _this.handleToolClick(e, currentTool.name || null);
@@ -97,6 +116,34 @@ var ListBoxToolbarVue2 = {
97
116
  }, this)]);
98
117
  },
99
118
  methods: {
119
+ getRtlSvgIcon: function getRtlSvgIcon(toolIcon) {
120
+ switch (toolIcon.name) {
121
+ case 'caret-alt-right':
122
+ return caretAltLeftIcon;
123
+ case 'caret-alt-left':
124
+ return caretAltRightIcon;
125
+ case 'caret-double-alt-right':
126
+ return caretDoubleAltLeftIcon;
127
+ case 'caret-double-alt-left':
128
+ return caretDoubleAltRightIcon;
129
+ default:
130
+ }
131
+ return toolIcon;
132
+ },
133
+ getRtlFontIcon: function getRtlFontIcon(toolIcon) {
134
+ switch (toolIcon) {
135
+ case 'caret-alt-right':
136
+ return 'caret-alt-left';
137
+ case 'caret-alt-left':
138
+ return 'caret-alt-right';
139
+ case 'caret-double-alt-right':
140
+ return 'caret-double-alt-left';
141
+ case 'caret-double-alt-left':
142
+ return 'caret-double-alt-right';
143
+ default:
144
+ }
145
+ return toolIcon;
146
+ },
100
147
  handleToolClick: function handleToolClick(event, name) {
101
148
  this.$emit('toolclick', {
102
149
  event: event,
@@ -5,7 +5,7 @@ export var packageMetadata = {
5
5
  name: '@progress/kendo-vue-listbox',
6
6
  productName: 'Kendo UI for Vue',
7
7
  productCodes: ['KENDOUIVUE', 'KENDOUICOMPLETE'],
8
- publishDate: 1684762963,
8
+ publishDate: 1684828018,
9
9
  version: '',
10
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
11
  };
@@ -12,27 +12,36 @@ var isV3 = allVue.version && allVue.version[0] === '3';
12
12
  var kendo_vue_buttons_1 = require("@progress/kendo-vue-buttons");
13
13
  var kendo_vue_intl_1 = require("@progress/kendo-vue-intl");
14
14
  var main_1 = require("./messages/main");
15
+ var kendo_vue_common_1 = require("@progress/kendo-vue-common");
16
+ var kendo_svg_icons_1 = require("@progress/kendo-svg-icons");
15
17
  var tools = [{
16
18
  name: 'moveUp',
17
- iconName: 'caret-alt-up'
19
+ iconName: 'caret-alt-up',
20
+ svgIcon: kendo_svg_icons_1.caretAltUpIcon
18
21
  }, {
19
22
  name: 'moveDown',
20
- iconName: 'caret-alt-down'
23
+ iconName: 'caret-alt-down',
24
+ svgIcon: kendo_svg_icons_1.caretAltDownIcon
21
25
  }, {
22
26
  name: 'transferTo',
23
- iconName: 'caret-alt-right'
27
+ iconName: 'caret-alt-right',
28
+ svgIcon: kendo_svg_icons_1.caretAltRightIcon
24
29
  }, {
25
30
  name: 'transferFrom',
26
- iconName: 'caret-alt-left'
31
+ iconName: 'caret-alt-left',
32
+ svgIcon: kendo_svg_icons_1.caretAltLeftIcon
27
33
  }, {
28
34
  name: 'transferAllTo',
29
- iconName: 'caret-double-alt-right'
35
+ iconName: 'caret-double-alt-right',
36
+ svgIcon: kendo_svg_icons_1.caretDoubleAltRightIcon
30
37
  }, {
31
38
  name: 'transferAllFrom',
32
- iconName: 'caret-double-alt-left'
39
+ iconName: 'caret-double-alt-left',
40
+ svgIcon: kendo_svg_icons_1.caretDoubleAltLeftIcon
33
41
  }, {
34
42
  name: 'remove',
35
- iconName: 'x'
43
+ iconName: 'x',
44
+ svgIcon: kendo_svg_icons_1.xIcon
36
45
  }];
37
46
  /**
38
47
  * @hidden
@@ -53,6 +62,14 @@ var ListBoxToolbarVue2 = {
53
62
  default: null
54
63
  }
55
64
  },
65
+ data: function data() {
66
+ return {
67
+ currentRtl: false
68
+ };
69
+ },
70
+ mounted: function mounted() {
71
+ this.currentRtl = (0, kendo_vue_common_1.isRtl)(this.$el);
72
+ },
56
73
  // @ts-ignore
57
74
  setup: !isV3 ? undefined : function () {
58
75
  var v3 = !!isV3;
@@ -83,12 +100,14 @@ var ListBoxToolbarVue2 = {
83
100
  "data-command": currentTool.name,
84
101
  title: title,
85
102
  "aria-label": title,
86
- icon: currentTool.iconName
103
+ icon: this.isRtl ? this.getRtlFontIcon(currentTool.iconName) : currentTool.iconName,
104
+ svgIcon: this.isRtl ? this.getRtlSvgIcon(currentTool.svgIcon) : currentTool.svgIcon
87
105
  },
88
106
  "data-command": currentTool.name,
89
107
  title: title,
90
108
  "aria-label": title,
91
- icon: currentTool.iconName,
109
+ icon: this.isRtl ? this.getRtlFontIcon(currentTool.iconName) : currentTool.iconName,
110
+ svgIcon: this.isRtl ? this.getRtlSvgIcon(currentTool.svgIcon) : currentTool.svgIcon,
92
111
  onClick: function onClick(e) {
93
112
  e.preventDefault();
94
113
  _this.handleToolClick(e, currentTool.name || null);
@@ -103,6 +122,34 @@ var ListBoxToolbarVue2 = {
103
122
  }, this)]);
104
123
  },
105
124
  methods: {
125
+ getRtlSvgIcon: function getRtlSvgIcon(toolIcon) {
126
+ switch (toolIcon.name) {
127
+ case 'caret-alt-right':
128
+ return kendo_svg_icons_1.caretAltLeftIcon;
129
+ case 'caret-alt-left':
130
+ return kendo_svg_icons_1.caretAltRightIcon;
131
+ case 'caret-double-alt-right':
132
+ return kendo_svg_icons_1.caretDoubleAltLeftIcon;
133
+ case 'caret-double-alt-left':
134
+ return kendo_svg_icons_1.caretDoubleAltRightIcon;
135
+ default:
136
+ }
137
+ return toolIcon;
138
+ },
139
+ getRtlFontIcon: function getRtlFontIcon(toolIcon) {
140
+ switch (toolIcon) {
141
+ case 'caret-alt-right':
142
+ return 'caret-alt-left';
143
+ case 'caret-alt-left':
144
+ return 'caret-alt-right';
145
+ case 'caret-double-alt-right':
146
+ return 'caret-double-alt-left';
147
+ case 'caret-double-alt-left':
148
+ return 'caret-double-alt-right';
149
+ default:
150
+ }
151
+ return toolIcon;
152
+ },
106
153
  handleToolClick: function handleToolClick(event, name) {
107
154
  this.$emit('toolclick', {
108
155
  event: event,
@@ -8,7 +8,7 @@ exports.packageMetadata = {
8
8
  name: '@progress/kendo-vue-listbox',
9
9
  productName: 'Kendo UI for Vue',
10
10
  productCodes: ['KENDOUIVUE', 'KENDOUICOMPLETE'],
11
- publishDate: 1684762963,
11
+ publishDate: 1684828018,
12
12
  version: '',
13
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
14
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@progress/kendo-vue-listbox",
3
- "version": "3.10.2",
3
+ "version": "3.11.0-dev.202305230751",
4
4
  "description": "Vue ListBox enables you to display a list of items and manage the data between multiple lists. Kendo UI for Vue ListBox package",
5
5
  "repository": {
6
6
  "type": "git",
@@ -36,13 +36,13 @@
36
36
  "vue": "^2.6.12 || ^3.0.2"
37
37
  },
38
38
  "dependencies": {
39
- "@progress/kendo-vue-common": "3.10.2"
39
+ "@progress/kendo-vue-common": "3.11.0-dev.202305230751"
40
40
  },
41
41
  "devDependencies": {
42
42
  "@progress/kendo-licensing": "^1.3.0",
43
43
  "@progress/kendo-svg-icons": "^1.0.0",
44
- "@progress/kendo-vue-buttons": "3.10.2",
45
- "@progress/kendo-vue-intl": "3.10.2"
44
+ "@progress/kendo-vue-buttons": "3.11.0-dev.202305230751",
45
+ "@progress/kendo-vue-intl": "3.11.0-dev.202305230751"
46
46
  },
47
47
  "@progress": {
48
48
  "friendlyName": "ListBox",