@progress/kendo-vue-data-tools 3.7.4-dev.202212020747 → 3.7.4-dev.202301091431

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 (123) hide show
  1. package/README.md +1 -1
  2. package/dist/cdn/js/kendo-vue-data-tools.js +1 -1
  3. package/dist/es/cells/FilterCell.js +35 -21
  4. package/dist/es/columnmenu/ColumnMenu.js +9 -3
  5. package/dist/es/columnmenu/ColumnMenuCheckboxFilter.js +10 -3
  6. package/dist/es/columnmenu/ColumnMenuItem.js +3 -3
  7. package/dist/es/columnmenu/ColumnMenuSort.js +8 -8
  8. package/dist/es/drag/ColumnDraggable.js +6 -2
  9. package/dist/es/drag/DragClue.js +6 -2
  10. package/dist/es/filter/Expression.js +17 -8
  11. package/dist/es/filter/Filter.js +20 -4
  12. package/dist/es/filter/GroupFilters.js +10 -2
  13. package/dist/es/filter/GroupToolbar.js +33 -8
  14. package/dist/es/header/FilterRow.d.ts +1 -0
  15. package/dist/es/header/FilterRow.js +9 -6
  16. package/dist/es/header/Header.d.ts +1 -0
  17. package/dist/es/header/Header.js +12 -2
  18. package/dist/es/header/HeaderRow.d.ts +2 -0
  19. package/dist/es/header/HeaderRow.js +78 -8
  20. package/dist/es/header/HeaderSelectionCell.d.ts +1 -0
  21. package/dist/es/header/HeaderSelectionCell.js +43 -13
  22. package/dist/es/header/HeaderTdElement.d.ts +46 -0
  23. package/dist/es/header/HeaderTdElement.js +92 -0
  24. package/dist/es/header/HeaderThElement.d.ts +8 -1
  25. package/dist/es/header/HeaderThElement.js +10 -2
  26. package/dist/es/header/main.d.ts +1 -0
  27. package/dist/es/header/main.js +1 -0
  28. package/dist/es/interfaces/FilterCellProps.d.ts +12 -0
  29. package/dist/es/messages/main.d.ts +5 -0
  30. package/dist/es/messages/main.js +5 -0
  31. package/dist/es/package-metadata.js +1 -1
  32. package/dist/es/pager/Pager.d.ts +13 -1
  33. package/dist/es/pager/Pager.js +66 -28
  34. package/dist/es/pager/PagerInput.d.ts +9 -1
  35. package/dist/es/pager/PagerInput.js +16 -2
  36. package/dist/es/pager/PagerNavigationButton.d.ts +13 -0
  37. package/dist/es/pager/PagerNavigationButton.js +31 -22
  38. package/dist/es/pager/PagerNumericButtons.d.ts +5 -1
  39. package/dist/es/pager/PagerNumericButtons.js +61 -27
  40. package/dist/es/pager/PagerPageSizes.d.ts +1 -0
  41. package/dist/es/pager/PagerPageSizes.js +3 -0
  42. package/dist/es/selection/utils.js +6 -8
  43. package/dist/esm/cells/FilterCell.js +35 -21
  44. package/dist/esm/columnmenu/ColumnMenu.js +9 -3
  45. package/dist/esm/columnmenu/ColumnMenuCheckboxFilter.js +10 -3
  46. package/dist/esm/columnmenu/ColumnMenuItem.js +3 -3
  47. package/dist/esm/columnmenu/ColumnMenuSort.js +8 -8
  48. package/dist/esm/drag/ColumnDraggable.js +6 -2
  49. package/dist/esm/drag/DragClue.js +6 -2
  50. package/dist/esm/filter/Expression.js +17 -8
  51. package/dist/esm/filter/Filter.js +20 -4
  52. package/dist/esm/filter/GroupFilters.js +10 -2
  53. package/dist/esm/filter/GroupToolbar.js +33 -8
  54. package/dist/esm/header/FilterRow.d.ts +1 -0
  55. package/dist/esm/header/FilterRow.js +9 -6
  56. package/dist/esm/header/Header.d.ts +1 -0
  57. package/dist/esm/header/Header.js +12 -2
  58. package/dist/esm/header/HeaderRow.d.ts +2 -0
  59. package/dist/esm/header/HeaderRow.js +78 -8
  60. package/dist/esm/header/HeaderSelectionCell.d.ts +1 -0
  61. package/dist/esm/header/HeaderSelectionCell.js +43 -13
  62. package/dist/esm/header/HeaderTdElement.d.ts +46 -0
  63. package/dist/esm/header/HeaderTdElement.js +92 -0
  64. package/dist/esm/header/HeaderThElement.d.ts +8 -1
  65. package/dist/esm/header/HeaderThElement.js +10 -2
  66. package/dist/esm/header/main.d.ts +1 -0
  67. package/dist/esm/header/main.js +1 -0
  68. package/dist/esm/interfaces/FilterCellProps.d.ts +12 -0
  69. package/dist/esm/messages/main.d.ts +5 -0
  70. package/dist/esm/messages/main.js +5 -0
  71. package/dist/esm/package-metadata.js +1 -1
  72. package/dist/esm/pager/Pager.d.ts +13 -1
  73. package/dist/esm/pager/Pager.js +66 -28
  74. package/dist/esm/pager/PagerInput.d.ts +9 -1
  75. package/dist/esm/pager/PagerInput.js +16 -2
  76. package/dist/esm/pager/PagerNavigationButton.d.ts +13 -0
  77. package/dist/esm/pager/PagerNavigationButton.js +31 -22
  78. package/dist/esm/pager/PagerNumericButtons.d.ts +5 -1
  79. package/dist/esm/pager/PagerNumericButtons.js +61 -27
  80. package/dist/esm/pager/PagerPageSizes.d.ts +1 -0
  81. package/dist/esm/pager/PagerPageSizes.js +3 -0
  82. package/dist/esm/selection/utils.js +6 -8
  83. package/dist/npm/cells/FilterCell.js +34 -20
  84. package/dist/npm/columnmenu/ColumnMenu.js +8 -2
  85. package/dist/npm/columnmenu/ColumnMenuCheckboxFilter.js +9 -2
  86. package/dist/npm/columnmenu/ColumnMenuItem.js +2 -2
  87. package/dist/npm/columnmenu/ColumnMenuSort.js +8 -8
  88. package/dist/npm/drag/ColumnDraggable.js +6 -2
  89. package/dist/npm/drag/DragClue.js +6 -2
  90. package/dist/npm/filter/Expression.js +17 -8
  91. package/dist/npm/filter/Filter.js +20 -4
  92. package/dist/npm/filter/GroupFilters.js +10 -2
  93. package/dist/npm/filter/GroupToolbar.js +33 -8
  94. package/dist/npm/header/FilterRow.d.ts +1 -0
  95. package/dist/npm/header/FilterRow.js +9 -6
  96. package/dist/npm/header/Header.d.ts +1 -0
  97. package/dist/npm/header/Header.js +11 -1
  98. package/dist/npm/header/HeaderRow.d.ts +2 -0
  99. package/dist/npm/header/HeaderRow.js +77 -7
  100. package/dist/npm/header/HeaderSelectionCell.d.ts +1 -0
  101. package/dist/npm/header/HeaderSelectionCell.js +42 -12
  102. package/dist/npm/header/HeaderTdElement.d.ts +46 -0
  103. package/dist/npm/header/HeaderTdElement.js +99 -0
  104. package/dist/npm/header/HeaderThElement.d.ts +8 -1
  105. package/dist/npm/header/HeaderThElement.js +10 -2
  106. package/dist/npm/header/main.d.ts +1 -0
  107. package/dist/npm/header/main.js +1 -0
  108. package/dist/npm/interfaces/FilterCellProps.d.ts +12 -0
  109. package/dist/npm/messages/main.d.ts +5 -0
  110. package/dist/npm/messages/main.js +6 -1
  111. package/dist/npm/package-metadata.js +1 -1
  112. package/dist/npm/pager/Pager.d.ts +13 -1
  113. package/dist/npm/pager/Pager.js +65 -27
  114. package/dist/npm/pager/PagerInput.d.ts +9 -1
  115. package/dist/npm/pager/PagerInput.js +16 -2
  116. package/dist/npm/pager/PagerNavigationButton.d.ts +13 -0
  117. package/dist/npm/pager/PagerNavigationButton.js +31 -22
  118. package/dist/npm/pager/PagerNumericButtons.d.ts +5 -1
  119. package/dist/npm/pager/PagerNumericButtons.js +61 -27
  120. package/dist/npm/pager/PagerPageSizes.d.ts +1 -0
  121. package/dist/npm/pager/PagerPageSizes.js +3 -0
  122. package/dist/npm/selection/utils.js +5 -7
  123. package/package.json +12 -11
@@ -0,0 +1,46 @@
1
+ import { DefineComponent, RecordPropsDefinition, ComponentOptions, Vue2type } from '../additionalTypes';
2
+ declare type DefaultData<V> = object | ((this: V) => {});
3
+ declare type DefaultMethods<V> = {
4
+ [key: string]: (this: V, ...args: any[]) => any;
5
+ };
6
+ export interface HeaderTdElementProps {
7
+ ariaColumnIndex?: number;
8
+ colSpan?: number;
9
+ rowSpan?: number;
10
+ role?: string;
11
+ columnId: string;
12
+ navigatable?: boolean;
13
+ }
14
+ /**
15
+ * @hidden
16
+ */
17
+ export interface HeaderTdElementMethods extends Vue2type {
18
+ onKeydown: (event: any) => void;
19
+ }
20
+ /**
21
+ * @hidden
22
+ */
23
+ export interface HeaderTdElementComputed {
24
+ [key: string]: any;
25
+ tdClass: object;
26
+ }
27
+ /**
28
+ * @hidden
29
+ */
30
+ export interface HeaderTdElementState {
31
+ _text: string | undefined;
32
+ }
33
+ /**
34
+ * @hidden
35
+ */
36
+ export interface HeaderTdElementAll extends HeaderTdElementMethods, HeaderTdElementState, HeaderTdElementComputed {
37
+ }
38
+ /**
39
+ * @hidden
40
+ */
41
+ declare let HeaderTdElementVue2: ComponentOptions<Vue2type, DefaultData<{}>, DefaultMethods<HeaderTdElementAll>, {}, RecordPropsDefinition<HeaderTdElementProps>>;
42
+ /**
43
+ * @hidden
44
+ */
45
+ declare const HeaderTdElement: DefineComponent<HeaderTdElementProps, any, {}, {}, HeaderTdElementMethods, {}, {}, {}, string, HeaderTdElementProps, HeaderTdElementProps, {}>;
46
+ export { HeaderTdElement, HeaderTdElementVue2 };
@@ -0,0 +1,99 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.HeaderTdElementVue2 = exports.HeaderTdElement = void 0;
7
+ // @ts-ignore
8
+ var Vue = require("vue");
9
+ var allVue = Vue;
10
+ var gh = allVue.h;
11
+ var isV3 = allVue.version && allVue.version[0] === '3';
12
+ var inject = allVue.inject;
13
+ var kendo_vue_common_1 = require("@progress/kendo-vue-common");
14
+ var constants_1 = require("../navigation/constants");
15
+ /**
16
+ * @hidden
17
+ */
18
+ var HeaderTdElementVue2 = {
19
+ name: 'KendoHeaderTdElement',
20
+ // @ts-ignore
21
+ emits: {
22
+ keydown: null
23
+ },
24
+ props: {
25
+ ariaColumnIndex: Number,
26
+ role: String,
27
+ columnId: String,
28
+ navigatable: Boolean
29
+ },
30
+ computed: {
31
+ tdClass: function tdClass() {
32
+ var _a;
33
+ var className = this.$props.className;
34
+ return _a = {
35
+ 'k-table-td': true
36
+ }, _a[className] = className, _a;
37
+ }
38
+ },
39
+ inject: {
40
+ getKeyboardNavigationAttributes: {
41
+ default: kendo_vue_common_1.noop
42
+ }
43
+ },
44
+ // @ts-ignore
45
+ setup: !isV3 ? undefined : function () {
46
+ var v3 = !!isV3;
47
+ var kendoIntlService = inject('kendoIntlService', {});
48
+ var kendoLocalizationService = inject('kendoLocalizationService', {});
49
+ return {
50
+ v3: v3,
51
+ kendoIntlService: kendoIntlService,
52
+ kendoLocalizationService: kendoLocalizationService
53
+ };
54
+ },
55
+ // @ts-ignore
56
+ render: function render(createElement) {
57
+ var h = gh || createElement;
58
+ var _a = this.$props,
59
+ columnId = _a.columnId,
60
+ navigatable = _a.navigatable,
61
+ ariaColumnIndex = _a.ariaColumnIndex,
62
+ role = _a.role;
63
+ var navAttrs = this.getKeyboardNavigationAttributes(columnId, navigatable);
64
+ var defaultSlot = (0, kendo_vue_common_1.getDefaultSlots)(this);
65
+ return h("td", {
66
+ style: {
67
+ top: '0px'
68
+ },
69
+ "aria-colindex": ariaColumnIndex,
70
+ attrs: this.v3 ? undefined : {
71
+ "aria-colindex": ariaColumnIndex,
72
+ role: role,
73
+ tabindex: navAttrs.tabIndex,
74
+ "data-keyboardnavlevel": navAttrs[constants_1.KEYBOARD_NAV_DATA_LEVEL],
75
+ "data-keyboardnavid": navAttrs[constants_1.KEYBOARD_NAV_DATA_ID]
76
+ },
77
+ "class": this.tdClass,
78
+ onKeydown: this.onKeyDown,
79
+ on: this.v3 ? undefined : {
80
+ "keydown": this.onKeyDown
81
+ },
82
+ role: role,
83
+ tabindex: navAttrs.tabIndex,
84
+ "data-keyboardnavlevel": navAttrs[constants_1.KEYBOARD_NAV_DATA_LEVEL],
85
+ "data-keyboardnavid": navAttrs[constants_1.KEYBOARD_NAV_DATA_ID]
86
+ }, [defaultSlot]);
87
+ },
88
+ methods: {
89
+ onKeyDown: function onKeyDown(e) {
90
+ this.$emit('keydown', e);
91
+ }
92
+ }
93
+ };
94
+ exports.HeaderTdElementVue2 = HeaderTdElementVue2;
95
+ /**
96
+ * @hidden
97
+ */
98
+ var HeaderTdElement = HeaderTdElementVue2;
99
+ exports.HeaderTdElement = HeaderTdElement;
@@ -20,6 +20,13 @@ export interface HeaderThElementProps {
20
20
  export interface HeaderThElementMethods extends Vue2type {
21
21
  onKeydown: (event: any) => void;
22
22
  }
23
+ /**
24
+ * @hidden
25
+ */
26
+ export interface HeaderThElementComputed {
27
+ [key: string]: any;
28
+ thClass: object;
29
+ }
23
30
  /**
24
31
  * @hidden
25
32
  */
@@ -29,7 +36,7 @@ export interface HeaderThElementState {
29
36
  /**
30
37
  * @hidden
31
38
  */
32
- export interface HeaderThElementAll extends HeaderThElementMethods, HeaderThElementState {
39
+ export interface HeaderThElementAll extends HeaderThElementMethods, HeaderThElementState, HeaderThElementComputed {
33
40
  }
34
41
  /**
35
42
  * @hidden
@@ -37,6 +37,15 @@ var HeaderThElementVue2 = {
37
37
  columnId: String,
38
38
  navigatable: Boolean
39
39
  },
40
+ computed: {
41
+ thClass: function thClass() {
42
+ var _a;
43
+ var className = this.$props.className;
44
+ return _a = {
45
+ 'k-table-th': true
46
+ }, _a[className] = className, _a;
47
+ }
48
+ },
40
49
  inject: {
41
50
  getKeyboardNavigationAttributes: {
42
51
  default: kendo_vue_common_1.noop
@@ -60,7 +69,6 @@ var HeaderThElementVue2 = {
60
69
  ariaSort = _a.ariaSort,
61
70
  colSpan = _a.colSpan,
62
71
  rowSpan = _a.rowSpan,
63
- className = _a.className,
64
72
  columnId = _a.columnId,
65
73
  navigatable = _a.navigatable,
66
74
  ariaColumnIndex = _a.ariaColumnIndex,
@@ -91,7 +99,7 @@ var HeaderThElementVue2 = {
91
99
  "aria-selected": ariaSelected,
92
100
  colspan: colSpan,
93
101
  rowspan: rowSpan,
94
- "class": className,
102
+ "class": this.thClass,
95
103
  onKeydown: this.onKeyDown,
96
104
  on: this.v3 ? undefined : {
97
105
  "keydown": this.onKeyDown
@@ -8,3 +8,4 @@ export * from './HeaderSelectionCell';
8
8
  export * from '../interfaces/SortSettings';
9
9
  export * from './utils/main';
10
10
  export * from './HeaderThElement';
11
+ export * from './HeaderTdElement';
@@ -24,3 +24,4 @@ __exportStar(require("./HeaderSelectionCell"), exports);
24
24
  __exportStar(require("../interfaces/SortSettings"), exports);
25
25
  __exportStar(require("./utils/main"), exports);
26
26
  __exportStar(require("./HeaderThElement"), exports);
27
+ __exportStar(require("./HeaderTdElement"), exports);
@@ -69,4 +69,16 @@ export interface FilterCellProps {
69
69
  * The ariaLabel of the filter editor.
70
70
  */
71
71
  ariaLabel?: string;
72
+ /**
73
+ * Configures the `size` of the cell.
74
+ *
75
+ * The available options are:
76
+ * - small
77
+ * - medium
78
+ * - large
79
+ * - null&mdash;Does not set a size `class`.
80
+ *
81
+ * @default `medium`
82
+ */
83
+ size?: null | 'small' | 'medium' | 'large' | string;
72
84
  }
@@ -254,6 +254,10 @@ export declare const columnMenuFilterOrLogic = "columnMenu.filterOrLogic";
254
254
  * @hidden
255
255
  */
256
256
  export declare const searchPlaceholder = "grid.searchPlaceholder";
257
+ /**
258
+ * @hidden
259
+ */
260
+ export declare const selectAllRows = "grid.selectAllRows";
257
261
  /**
258
262
  * @hidden
259
263
  */
@@ -317,6 +321,7 @@ export declare const messages: {
317
321
  "pager.of": string;
318
322
  "pager.totalPages": string;
319
323
  "grid.searchPlaceholder": string;
324
+ "grid.selectAllRows": string;
320
325
  "grid.filterCheckAll": string;
321
326
  "sort.ariaLabel": string;
322
327
  "filter.ariaLabel": string;
@@ -2,7 +2,7 @@
2
2
  var _a;
3
3
  Object.defineProperty(exports, "__esModule", { value: true });
4
4
  exports.columnMenuFilterContainsOperator = exports.columnMenuFilterStartsWithOperator = exports.columnMenuFilterIsNotEmptyOperator = exports.columnMenuFilterIsEmptyOperator = exports.columnMenuFilterIsNotNullOperator = exports.columnMenuFilterIsNullOperator = exports.columnMenuFilterNotEqOperator = exports.columnMenuFilterEqOperator = exports.columnMenuSortDescending = exports.columnMenuSortAscending = exports.columnMenuFilterTitle = exports.columnMenuFilterSubmitButton = exports.columnMenuFilterClearButton = exports.columnMenuFilterChooseOperator = exports.filterClose = exports.filterAddGroup = exports.filterAddExpression = exports.filterOrLogic = exports.filterAndLogic = exports.filterBeforeOrEqualOperator = exports.filterBeforeOperator = exports.filterAfterOperator = exports.filterAfterOrEqualOperator = exports.filterIsFalse = exports.filterIsTrue = exports.filterLtOperator = exports.filterLteOperator = exports.filterGtOperator = exports.filterGteOperator = exports.filterEndsWithOperator = exports.filterNotContainsOperator = exports.filterContainsOperator = exports.filterStartsWithOperator = exports.filterIsNotEmptyOperator = exports.filterIsEmptyOperator = exports.filterIsNotNullOperator = exports.filterIsNullOperator = exports.filterNotEqOperator = exports.filterEqOperator = exports.pagerTotalPages = exports.pagerOf = exports.pagerPage = exports.pagerPageSelection = exports.pagerItemPerPage = exports.pagerLastPage = exports.pagerNextPage = exports.pagerPreviousPage = exports.pagerFirstPage = exports.pagerInfo = exports.columnMenu = void 0;
5
- exports.messages = exports.filterDropDownOperatorAriaLabel = exports.filterDateFilterAriaLabel = exports.filterTextFilterAriaLabel = exports.filterNumericFilterAriaLabel = exports.filterEnumFilterDropdownAriaLabel = exports.filterExpressionOperatorDropdownAriaLabel = exports.filterExpressionDropdownAriaLabel = exports.filterExpressionAriaLabel = exports.filterGroupAriaLabel = exports.filterAriaLabel = exports.sortAriaLabel = exports.filterCheckAll = exports.searchPlaceholder = exports.columnMenuFilterOrLogic = exports.columnMenuFilterAndLogic = exports.columnMenuFilterBeforeOrEqualOperator = exports.columnMenuFilterBeforeOperator = exports.columnMenuFilterAfterOperator = exports.columnMenuFilterAfterOrEqualOperator = exports.columnMenuFilterIsTrue = exports.columnMenuFilterLtOperator = exports.columnMenuFilterLteOperator = exports.columnMenuFilterGtOperator = exports.columnMenuFilterGteOperator = exports.columnMenuFilterEndsWithOperator = exports.columnMenuFilterNotContainsOperator = void 0;
5
+ exports.messages = exports.filterDropDownOperatorAriaLabel = exports.filterDateFilterAriaLabel = exports.filterTextFilterAriaLabel = exports.filterNumericFilterAriaLabel = exports.filterEnumFilterDropdownAriaLabel = exports.filterExpressionOperatorDropdownAriaLabel = exports.filterExpressionDropdownAriaLabel = exports.filterExpressionAriaLabel = exports.filterGroupAriaLabel = exports.filterAriaLabel = exports.sortAriaLabel = exports.filterCheckAll = exports.selectAllRows = exports.searchPlaceholder = exports.columnMenuFilterOrLogic = exports.columnMenuFilterAndLogic = exports.columnMenuFilterBeforeOrEqualOperator = exports.columnMenuFilterBeforeOperator = exports.columnMenuFilterAfterOperator = exports.columnMenuFilterAfterOrEqualOperator = exports.columnMenuFilterIsTrue = exports.columnMenuFilterLtOperator = exports.columnMenuFilterLteOperator = exports.columnMenuFilterGtOperator = exports.columnMenuFilterGteOperator = exports.columnMenuFilterEndsWithOperator = exports.columnMenuFilterNotContainsOperator = void 0;
6
6
  /**
7
7
  * @hidden
8
8
  */
@@ -259,6 +259,10 @@ exports.columnMenuFilterOrLogic = 'columnMenu.filterOrLogic';
259
259
  * @hidden
260
260
  */
261
261
  exports.searchPlaceholder = 'grid.searchPlaceholder';
262
+ /**
263
+ * @hidden
264
+ */
265
+ exports.selectAllRows = 'grid.selectAllRows';
262
266
  /**
263
267
  * @hidden
264
268
  */
@@ -322,6 +326,7 @@ exports.messages = (_a = {},
322
326
  _a[exports.pagerOf] = 'Of',
323
327
  _a[exports.pagerTotalPages] = '{0}',
324
328
  _a[exports.searchPlaceholder] = 'Search',
329
+ _a[exports.selectAllRows] = 'Select All Rows',
325
330
  _a[exports.filterCheckAll] = 'Check All',
326
331
  _a[exports.sortAriaLabel] = 'Sortable',
327
332
  _a[exports.filterAriaLabel] = 'Filter',
@@ -8,7 +8,7 @@ exports.packageMetadata = {
8
8
  name: '@progress/kendo-vue-data-tools',
9
9
  productName: 'Kendo UI for Vue',
10
10
  productCodes: ['KENDOUIVUE', 'KENDOUICOMPLETE'],
11
- publishDate: 1669966763,
11
+ publishDate: 1673273869,
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
  };
@@ -34,6 +34,18 @@ export interface PagerProps extends GridPagerSettings {
34
34
  responsive?: boolean;
35
35
  pagerRender?: any;
36
36
  width?: number | string;
37
+ /**
38
+ * Configures the `size` of the Pager.
39
+ *
40
+ * The available options are:
41
+ * - small
42
+ * - medium
43
+ * - large
44
+ * - null&mdash;Does not set a size `class`.
45
+ *
46
+ * @default `medium`
47
+ */
48
+ size?: null | 'small' | 'medium' | 'large' | string;
37
49
  /**
38
50
  * A map with the messages.
39
51
  */
@@ -80,7 +92,7 @@ export interface PagerComputed {
80
92
  * @hidden
81
93
  */
82
94
  export interface PagerData {
83
- size: string;
95
+ currentSize: string;
84
96
  }
85
97
  /**
86
98
  * @hidden
@@ -30,6 +30,7 @@ var PagerNavigationButton_1 = require("./PagerNavigationButton");
30
30
  var main_1 = require("../messages/main");
31
31
  var kendo_vue_intl_1 = require("@progress/kendo-vue-intl");
32
32
  var kendo_vue_common_1 = require("@progress/kendo-vue-common");
33
+ var kendo_svg_icons_1 = require("@progress/kendo-svg-icons");
33
34
  /**
34
35
  * @hidden
35
36
  */
@@ -74,12 +75,19 @@ var PagerVue2 = {
74
75
  type: Boolean,
75
76
  default: true
76
77
  },
78
+ size: {
79
+ type: String,
80
+ default: 'medium',
81
+ validator: function validator(value) {
82
+ return [null, 'small', 'medium', 'large'].includes(value);
83
+ }
84
+ },
77
85
  pagerRender: [String, Function, Object],
78
86
  width: [Number, String]
79
87
  },
80
88
  data: function data() {
81
89
  return {
82
- size: 'normal'
90
+ currentSize: 'medium'
83
91
  };
84
92
  },
85
93
  mounted: function mounted() {
@@ -107,11 +115,11 @@ var PagerVue2 = {
107
115
  computed: {
108
116
  wrapperClass: {
109
117
  get: function get() {
110
- return {
111
- 'k-pager': true,
112
- 'k-pager-sm': this.size === 'small',
113
- 'k-pager-md': this.size === 'medium'
114
- };
118
+ var _a;
119
+ var size = this.$props.size;
120
+ return _a = {
121
+ 'k-pager': true
122
+ }, _a["k-pager-".concat(kendo_vue_common_1.kendoThemeMaps.sizeMap[size] || size)] = size, _a["k-pager-mobile-".concat(kendo_vue_common_1.kendoThemeMaps.sizeMap[this.currentSize])] = this.currentSize, _a;
115
123
  }
116
124
  },
117
125
  totalPages: {
@@ -154,11 +162,11 @@ var PagerVue2 = {
154
162
  }
155
163
  var width = element.offsetWidth;
156
164
  if (width < RESPONSIVE_BREAKPOINT_MEDIUM) {
157
- this.size = 'small';
165
+ this.currentSize = 'small';
158
166
  } else if (width >= RESPONSIVE_BREAKPOINT_MEDIUM && width < RESPONSIVE_BREAKPOINT_LARGE) {
159
- this.size = 'medium';
167
+ this.currentSize = 'medium';
160
168
  } else {
161
- this.size = 'large';
169
+ this.currentSize = 'large';
162
170
  }
163
171
  },
164
172
  transformDimesion: function transformDimesion(initialValue) {
@@ -224,13 +232,15 @@ var PagerVue2 = {
224
232
  var changer = settings.type === 'numeric' ?
225
233
  // @ts-ignore
226
234
  h(PagerNumericButtons_1.PagerNumericButtons, {
227
- size: this.size,
235
+ responsiveSize: this.currentSize,
228
236
  attrs: this.v3 ? undefined : {
237
+ responsiveSize: this.currentSize,
229
238
  size: this.size,
230
239
  buttonCount: settings.buttonCount || 0,
231
240
  totalPages: this.totalPages,
232
241
  currentPage: this.currentPage
233
242
  },
243
+ size: this.size,
234
244
  buttonCount: settings.buttonCount || 0,
235
245
  totalPages: this.totalPages,
236
246
  currentPage: this.currentPage,
@@ -245,29 +255,37 @@ var PagerVue2 = {
245
255
  attrs: this.v3 ? undefined : {
246
256
  currentPage: this.currentPage,
247
257
  totalPages: this.totalPages,
248
- messagesMap: messagesMap
258
+ messagesMap: messagesMap,
259
+ size: this.size
249
260
  },
250
261
  totalPages: this.totalPages,
251
262
  onPagechange: this.changePage,
252
263
  on: this.v3 ? undefined : {
253
264
  "pagechange": this.changePage
254
265
  },
255
- messagesMap: messagesMap
266
+ messagesMap: messagesMap,
267
+ size: this.size
256
268
  });
257
269
  var first, prev, next, last;
258
270
  if (settings.previousNext) {
259
271
  first =
260
272
  // @ts-ignore function children
261
273
  h(PagerNavigationButton_1.PagerNavigationButton, {
262
- "class": 'k-pager-first' + (this.currentPage === 1 ? ' k-disabled' : ''),
263
- page: 1,
274
+ "class": 'k-pager-first',
275
+ size: this.size,
264
276
  attrs: this.v3 ? undefined : {
277
+ size: this.size,
278
+ disabled: this.currentPage === 1,
265
279
  page: 1,
266
280
  title: localizationService.toLanguageString(firstPageMessage.messageKey, firstPageMessage.defaultMessage),
267
- icon: 'caret-alt-to-left'
281
+ icon: 'caret-alt-to-left',
282
+ svgIcon: kendo_svg_icons_1.caretAltToLeftIcon
268
283
  },
284
+ disabled: this.currentPage === 1,
285
+ page: 1,
269
286
  title: localizationService.toLanguageString(firstPageMessage.messageKey, firstPageMessage.defaultMessage),
270
287
  icon: 'caret-alt-to-left',
288
+ svgIcon: kendo_svg_icons_1.caretAltToLeftIcon,
271
289
  onPagechange: this.changePage,
272
290
  on: this.v3 ? undefined : {
273
291
  "pagechange": this.changePage
@@ -276,15 +294,20 @@ var PagerVue2 = {
276
294
  prev =
277
295
  // @ts-ignore function children
278
296
  h(PagerNavigationButton_1.PagerNavigationButton, {
279
- "class": this.currentPage === 1 ? ' k-disabled' : '',
280
- page: this.currentPage - 1,
297
+ disabled: this.currentPage === 1,
281
298
  attrs: this.v3 ? undefined : {
299
+ disabled: this.currentPage === 1,
300
+ size: this.size,
282
301
  page: this.currentPage - 1,
283
302
  title: localizationService.toLanguageString(previousPageMessage.messageKey, previousPageMessage.defaultMessage),
284
- icon: 'caret-alt-left'
303
+ icon: 'caret-alt-left',
304
+ svgIcon: kendo_svg_icons_1.caretAltLeftIcon
285
305
  },
306
+ size: this.size,
307
+ page: this.currentPage - 1,
286
308
  title: localizationService.toLanguageString(previousPageMessage.messageKey, previousPageMessage.defaultMessage),
287
309
  icon: 'caret-alt-left',
310
+ svgIcon: kendo_svg_icons_1.caretAltLeftIcon,
288
311
  onPagechange: this.changePage,
289
312
  on: this.v3 ? undefined : {
290
313
  "pagechange": this.changePage
@@ -293,15 +316,20 @@ var PagerVue2 = {
293
316
  next =
294
317
  // @ts-ignore function children
295
318
  h(PagerNavigationButton_1.PagerNavigationButton, {
296
- "class": this.currentPage === this.totalPages ? ' k-disabled' : '',
297
- page: this.currentPage + 1,
319
+ disabled: this.currentPage === this.totalPages,
298
320
  attrs: this.v3 ? undefined : {
321
+ disabled: this.currentPage === this.totalPages,
322
+ size: this.size,
299
323
  page: this.currentPage + 1,
300
324
  title: localizationService.toLanguageString(nextPageMessage.messageKey, nextPageMessage.defaultMessage),
301
- icon: 'caret-alt-right'
325
+ icon: 'caret-alt-right',
326
+ svgIcon: kendo_svg_icons_1.caretAltRightIcon
302
327
  },
328
+ size: this.size,
329
+ page: this.currentPage + 1,
303
330
  title: localizationService.toLanguageString(nextPageMessage.messageKey, nextPageMessage.defaultMessage),
304
331
  icon: 'caret-alt-right',
332
+ svgIcon: kendo_svg_icons_1.caretAltRightIcon,
305
333
  onPagechange: this.changePage,
306
334
  on: this.v3 ? undefined : {
307
335
  "pagechange": this.changePage
@@ -310,15 +338,21 @@ var PagerVue2 = {
310
338
  last =
311
339
  // @ts-ignore function children
312
340
  h(PagerNavigationButton_1.PagerNavigationButton, {
313
- "class": 'k-pager-last' + (this.currentPage === this.totalPages ? ' k-disabled' : ''),
314
- page: this.totalPages,
341
+ "class": 'k-pager-last',
342
+ disabled: this.currentPage === this.totalPages,
315
343
  attrs: this.v3 ? undefined : {
344
+ disabled: this.currentPage === this.totalPages,
345
+ size: this.size,
316
346
  page: this.totalPages,
317
347
  title: localizationService.toLanguageString(lastPageMessage.messageKey, lastPageMessage.defaultMessage),
318
- icon: 'caret-alt-to-right'
348
+ icon: 'caret-alt-to-right',
349
+ svgIcon: kendo_svg_icons_1.caretAltToRightIcon
319
350
  },
351
+ size: this.size,
352
+ page: this.totalPages,
320
353
  title: localizationService.toLanguageString(lastPageMessage.messageKey, lastPageMessage.defaultMessage),
321
354
  icon: 'caret-alt-to-right',
355
+ svgIcon: kendo_svg_icons_1.caretAltToRightIcon,
322
356
  onPagechange: this.changePage,
323
357
  on: this.v3 ? undefined : {
324
358
  "pagechange": this.changePage
@@ -337,11 +371,13 @@ var PagerVue2 = {
337
371
  pageSize: this.currentTake,
338
372
  pageSizes: settings.pageSizes,
339
373
  value: settings.pageSizeValue,
340
- messagesMap: messagesMap
374
+ messagesMap: messagesMap,
375
+ size: this.size
341
376
  },
342
377
  pageSizes: settings.pageSizes,
343
378
  value: settings.pageSizeValue,
344
- messagesMap: messagesMap
379
+ messagesMap: messagesMap,
380
+ size: this.size
345
381
  });
346
382
  var infoElement = !settings.info ? '' :
347
383
  // @ts-ignore function children
@@ -386,7 +422,9 @@ var PagerVue2 = {
386
422
  attrs: this.v3 ? undefined : {
387
423
  role: "navigation"
388
424
  }
389
- }, [first, prev, changer, next, last, renderPageSizes, infoElement]);
425
+ }, [h("div", {
426
+ "class": 'k-pager-numbers-wrap'
427
+ }, [first, prev, changer, next, last]), renderPageSizes, infoElement]);
390
428
  }
391
429
  };
392
430
  exports.PagerVue2 = PagerVue2;
@@ -12,6 +12,7 @@ export interface PagerInputProps {
12
12
  * The current page.
13
13
  */
14
14
  currentPage: number;
15
+ size?: null | 'small' | 'medium' | 'large' | string;
15
16
  /**
16
17
  * @hidden
17
18
  */
@@ -37,7 +38,14 @@ export interface PagerInputState {
37
38
  /**
38
39
  * @hidden
39
40
  */
40
- export interface PagerInputAll extends PagerInputMethods, PagerInputState {
41
+ export interface PagerInputComputed {
42
+ [key: string]: any;
43
+ inputClass: object;
44
+ }
45
+ /**
46
+ * @hidden
47
+ */
48
+ export interface PagerInputAll extends PagerInputMethods, PagerInputState, PagerInputComputed {
41
49
  }
42
50
  /**
43
51
  * @hidden
@@ -12,6 +12,7 @@ var isV3 = allVue.version && allVue.version[0] === '3';
12
12
  var inject = allVue.inject;
13
13
  var main_1 = require("../messages/main");
14
14
  var kendo_vue_intl_1 = require("@progress/kendo-vue-intl");
15
+ var kendo_vue_common_1 = require("@progress/kendo-vue-common");
15
16
  /**
16
17
  * @hidden
17
18
  */
@@ -20,7 +21,8 @@ var PagerInputVue2 = {
20
21
  props: {
21
22
  totalPages: Number,
22
23
  currentPage: Number,
23
- messagesMap: Function
24
+ messagesMap: Function,
25
+ size: String
24
26
  },
25
27
  inject: {
26
28
  kendoIntlService: {
@@ -33,6 +35,18 @@ var PagerInputVue2 = {
33
35
  created: function created() {
34
36
  this._text = undefined;
35
37
  },
38
+ computed: {
39
+ inputClass: function inputClass() {
40
+ var _a;
41
+ var size = this.$props.size;
42
+ return _a = {
43
+ 'k-textbox': true,
44
+ 'k-input': true,
45
+ 'k-rounded-md': true,
46
+ 'k-input-solid': true
47
+ }, _a["k-input-".concat(kendo_vue_common_1.kendoThemeMaps.sizeMap[size] || size)] = size, _a;
48
+ }
49
+ },
36
50
  methods: {
37
51
  changeHangler: function changeHangler(e) {
38
52
  var text = this._text = e.target.value.replace(/\D/g, '');
@@ -81,7 +95,7 @@ var PagerInputVue2 = {
81
95
  return h("span", {
82
96
  "class": "k-pager-input k-label"
83
97
  }, [localizationService.toLanguageString(pageMessage.messageKey, pageMessage.defaultMessage), h("span", {
84
- "class": "k-textbox k-input k-input-md k-rounded-md k-input-solid"
98
+ "class": this.inputClass
85
99
  }, [h("input", {
86
100
  "class": "k-input-inner",
87
101
  value: this.v3 ? this.value() : null,
@@ -1,4 +1,5 @@
1
1
  import { DefineComponent, RecordPropsDefinition, ComponentOptions, Vue2type } from '../additionalTypes';
2
+ import { SVGIcon } from '@progress/kendo-svg-icons';
2
3
  declare type DefaultData<V> = object | ((this: V) => {});
3
4
  declare type DefaultMethods<V> = {
4
5
  [key: string]: (this: V, ...args: any[]) => any;
@@ -12,10 +13,22 @@ export interface PagerNavigationButtonProps {
12
13
  * The class responsible for the icon of the button.
13
14
  */
14
15
  icon: string;
16
+ /**
17
+ * The svg icon responsible for the icon of the button.
18
+ */
19
+ svgIcon: SVGIcon;
15
20
  /**
16
21
  * The page number returned when the button is clicked.
17
22
  */
18
23
  page: number;
24
+ /**
25
+ * The disabled state of the button.
26
+ */
27
+ disabled: boolean;
28
+ /**
29
+ * The size of the button.
30
+ */
31
+ size: string;
19
32
  }
20
33
  export interface PagerNavigationButtonEmits {
21
34
  /**