@progress/kendo-vue-grid 3.3.3 → 3.3.5-dev.202206141337

package/dist/es/columnMenu/GridColumnMenuFilter.js

@@ -55,7 +55,7 @@ export var rootFilterOrDefault = function rootFilterOrDefault(rootFilter) {
 }; // tslint:disable:max-line-length
 
 /**
- * Can be used to check if filtering is applied to a specific field ([see example]({% slug column_menu_grid_native %}#toc-styling-the-column-menu-icon)). Useful for creating active filter indicators.
+ * Can be used to check if filtering is applied to a specific field ([see example]({% slug column_menu_grid %}#toc-styling-the-column-menu-icon)). Useful for creating active filter indicators.
  */
 // tslint:enable:max-line-length
 
@@ -73,7 +73,7 @@ export var filterGroupByField = function filterGroupByField(field, filter) {
   return compositeFilters[0] || null;
 };
 /**
- * Represents the default `GridColumnMenuFilter` component.
+ * @hidden
  */
 
 var GridColumnMenuFilterVue2 = {
@@ -621,5 +621,142 @@ var GridColumnMenuFilterVue2 = {
     );
   }
 };
+/**
+ * Represents the GridColumnMenuFilter component.
+ *
+ * {% meta height:410 %}
+ *  ```html-preview
+ *  <div id="vueapp">
+ *     <Grid :style="{height: '280px'}"
+ *          :data-items="gridData"
+ *          :sortable="true"
+ *          :sort= "sort"
+ *          :filter="filter"
+ *          :expand-field="'Discontinued'"
+ *          @datastatechange="dataStateChange"
+ *          @expandchange="expandChange"
+ *          :columns="columns">
+ *       </Grid>
+ *  </div>
+ * ```
+ * ```js
+ * import { Grid, GridColumnMenuFilter } from '@progress/kendo-vue-grid';
+ * import { process } from '@progress/kendo-data-query';
+ *      const ColumnMenu = {
+ *        props: {
+ *            column: Object,
+ *            sortable: [Boolean, Object],
+ *            sort: {
+ *                type: Array
+ *            },
+ *            filter: Object,
+ *            filterable: Boolean
+ *        },
+ *        components: {
+ *            GridColumnMenuFilter
+ *        },
+ *        template: `<div>
+ *            <GridColumnMenuFilter
+ *                :column="column"
+ *                :filterable="filterable"
+ *                :filter="filter"
+ *                @closemenu ="closeMenu"
+ *                @expandchange = "expandChange"
+ *                @filterchange = "filterChange"
+ *            />
+ *        </div>`,
+ *        methods: {
+ *            expandChange () {
+ *                this.$emit('expandchange');
+ *            },
+ *            closeMenu () {
+ *                this.$emit('closemenu');
+ *            },
+ *            filterChange (newDescriptor, e) {
+ *                this.$emit('filterchange', newDescriptor, e);
+ *            }
+ *        }
+ *      };
+ *
+ *      Vue.component('Grid', Grid);
+ *      new Vue({
+ *          el: '#vueapp',
+ *          components: {
+ *            Grid
+ *          },
+ *          created: function() {
+ *             this.getData();
+ *          },
+ *          methods: {
+ *            getData: function () {
+ *                let dataState = {
+ *                    filter: this.filter,
+ *                    sort: this.sort
+ *                };
+ *                this.gridData = process([{
+ *                    "ProductID": 1,
+ *                    "ProductName": "Chai",
+ *                    "UnitsInStock": 39,
+ *                    "Discontinued": false,
+ *                    "FirstOrderedOn": new Date(1996, 8, 20)
+ *                },{
+ *                    "ProductID": 2,
+ *                    "ProductName": "Chang",
+ *                    "UnitsInStock": 17,
+ *                    "Discontinued": false,
+ *                    "FirstOrderedOn": new Date(1996, 7, 12)
+ *                },{
+ *                    "ProductID": 3,
+ *                    "ProductName": "Aniseed Syrup",
+ *                    "UnitsInStock": 13,
+ *                    "Discontinued": false,
+ *                    "FirstOrderedOn": new Date(1996, 8, 26)
+ *                },{
+ *                    "ProductID": 4,
+ *                    "ProductName": "Chef Anton's Cajun Seasoning",
+ *                    "UnitsInStock": 53,
+ *                    "Discontinued": false,
+ *                    "FirstOrderedOn": new Date(1996, 9, 19)
+ *                }], dataState);
+ *            },
+ *            createAppState: function(dataState) {
+ *                this.sort = dataState.sort;
+ *                this.filter = dataState.filter;
+ *                this.getData();
+ *            },
+ *            dataStateChange: function (event) {
+ *                this.createAppState(event.data);
+ *            },
+ *            expandChange: function (event) {
+ *                 event.dataItem[event.target.$props.expandField] = event.value;
+ *                 //
+ *                 // In Vue 2 context, instead of the above line, inside the expandChange method we should have the following:
+ *                 //
+ *                 //   Vue.set(
+ *                 //     event.dataItem,
+ *                 //     event.target.$props.expandField,
+ *                 //     event.dataItem.expanded === undefined ? false : !event.dataItem.expanded
+ *                 //   );
+ *                 //
+ *            }
+ *          },
+ *          data: function () {
+ *              return {
+ *                 filter: null,
+ *                 sort: [],
+ *                  gridData: [],
+ *                  columns: [
+ *                      { field: 'ProductID'},
+ *                      { field: 'ProductName', title: 'Product Name' },
+ *                      { field: 'UnitsInStock', title: 'Units In Stock', columnMenu: ColumnMenu }
+ *                  ]
+ *              };
+ *          }
+ *       } );
+ * ```
+ *
+ * ### props <span class='code'>[GridColumnMenuFilterProps]({% slug api_grid_columnmenufilterprops %})</span>
+ */
+
 var GridColumnMenuFilter = GridColumnMenuFilterVue2;
 export { GridColumnMenuFilter, GridColumnMenuFilterVue2 };

package/dist/es/columnMenu/GridColumnMenuFilterCell.d.ts

@@ -35,8 +35,11 @@ export interface GridColumnMenuFilterCellMethods extends Vue2type {
     boolDropdownChange: (value: any, e: any) => void;
 }
 /**
- * Represents the default `GridColumnMenuFilterCell` component.
+ * @hidden
  */
 declare let GridColumnMenuFilterCellVue2: ComponentOptions<Vue2type, DefaultData<{}>, DefaultMethods<GridColumnMenuFilterCellMethods>, {}, RecordPropsDefinition<ColumnMenuFilterCellProps>>;
+/**
+ * @hidden
+ */
 declare const GridColumnMenuFilterCell: DefineComponent<ColumnMenuFilterCellProps, any, {}, {}, GridColumnMenuFilterCellMethods, {}, {}, {}, string, ColumnMenuFilterCellProps, ColumnMenuFilterCellProps, {}>;
 export { GridColumnMenuFilterCell, GridColumnMenuFilterCellVue2 };

package/dist/es/columnMenu/GridColumnMenuFilterCell.js

@@ -7,7 +7,7 @@ import { NumericTextBox } from '@progress/kendo-vue-inputs';
 import { DatePicker } from '@progress/kendo-vue-dateinputs';
 import { cellBoolDropdownChange, cellInputChange, cellOperatorChange } from '../filterCommon';
 /**
- * Represents the default `GridColumnMenuFilterCell` component.
+ * @hidden
  */
 
 var GridColumnMenuFilterCellVue2 = {
@@ -166,5 +166,9 @@ var GridColumnMenuFilterCellVue2 = {
     }), filterComponent.call(this, this.$props.filterType, this.$props.value, this.$props.booleanValues)]);
   }
 };
+/**
+ * @hidden
+ */
+
 var GridColumnMenuFilterCell = GridColumnMenuFilterCellVue2;
 export { GridColumnMenuFilterCell, GridColumnMenuFilterCellVue2 };

package/dist/es/columnMenu/GridColumnMenuFilterUI.d.ts

@@ -14,8 +14,11 @@ export interface GridColumnMenuFilterUIMethods extends Vue2type {
     logicChange: (e: any) => void;
 }
 /**
- * Represents the default `GridColumnMenuFilterUI` component.
+ * @hidden
  */
 declare let GridColumnMenuFilterUIVue2: ComponentOptions<Vue2type, DefaultData<{}>, DefaultMethods<GridColumnMenuFilterUIMethods>, {}, RecordPropsDefinition<GridColumnMenuFilterUIProps>>;
+/**
+ * @hidden
+ */
 declare const GridColumnMenuFilterUI: DefineComponent<GridColumnMenuFilterUIProps, any, {}, {}, GridColumnMenuFilterUIMethods, {}, {}, {}, string, GridColumnMenuFilterUIProps, GridColumnMenuFilterUIProps, {}>;
 export { GridColumnMenuFilterUI, GridColumnMenuFilterUIVue2 };

package/dist/es/columnMenu/GridColumnMenuFilterUI.js

@@ -6,7 +6,7 @@ import { GridColumnMenuFilterCell } from './GridColumnMenuFilterCell';
 import { DropDownList } from '@progress/kendo-vue-dropdowns';
 import { getTemplate } from '@progress/kendo-vue-common';
 /**
- * Represents the default `GridColumnMenuFilterUI` component.
+ * @hidden
  */
 
 var GridColumnMenuFilterUIVue2 = {
@@ -146,5 +146,9 @@ var GridColumnMenuFilterUIVue2 = {
     });
   }
 };
+/**
+ * @hidden
+ */
+
 var GridColumnMenuFilterUI = GridColumnMenuFilterUIVue2;
 export { GridColumnMenuFilterUI, GridColumnMenuFilterUIVue2 };

package/dist/es/columnMenu/GridColumnMenuItem.d.ts

@@ -32,8 +32,11 @@ export interface GridColumnMenuItemMethods extends Vue2type {
     onKeyDown: () => void;
 }
 /**
- * Represents the default `GridColumnMenuItem` component.
+ * @hidden
  */
 declare let GridColumnMenuItemVue2: ComponentOptions<Vue2type, DefaultData<{}>, DefaultMethods<GridColumnMenuItemMethods>, {}, RecordPropsDefinition<GridColumnMenuItemProps>>;
+/**
+ * @hidden
+ */
 declare const GridColumnMenuItem: DefineComponent<GridColumnMenuItemProps, any, {}, {}, GridColumnMenuItemMethods, {}, {}, {}, string, GridColumnMenuItemProps, GridColumnMenuItemProps, {}>;
 export { GridColumnMenuItem, GridColumnMenuItemVue2 };

package/dist/es/columnMenu/GridColumnMenuItem.js

@@ -4,7 +4,7 @@ var allVue = Vue;
 var gh = allVue.h;
 import { Keys } from '@progress/kendo-vue-common';
 /**
- * Represents the default `GridColumnMenuItem` component.
+ * @hidden
  */
 
 var GridColumnMenuItemVue2 = {
@@ -54,5 +54,9 @@ var GridColumnMenuItemVue2 = {
     }), title]);
   }
 };
+/**
+ * @hidden
+ */
+
 var GridColumnMenuItem = GridColumnMenuItemVue2;
 export { GridColumnMenuItem, GridColumnMenuItemVue2 };

package/dist/es/columnMenu/GridColumnMenuItemContent.d.ts

@@ -24,8 +24,11 @@ export interface GridColumnMenuItemContentMethods extends Vue2type {
     triggerRemove: (dataItem: any) => void;
 }
 /**
- * Represents the default `GridColumnMenuItemContent` component.
+ * @hidden
  */
 declare let GridColumnMenuItemContentVue2: ComponentOptions<Vue2type, DefaultData<{}>, DefaultMethods<GridColumnMenuItemContentMethods>, {}, RecordPropsDefinition<GridColumnMenuItemContentProps>>;
+/**
+ * @hidden
+ */
 declare const GridColumnMenuItemContent: DefineComponent<GridColumnMenuItemContentProps, any, {}, {}, GridColumnMenuItemContentMethods, {}, {}, {}, string, GridColumnMenuItemContentProps, GridColumnMenuItemContentProps, {}>;
 export { GridColumnMenuItemContent, GridColumnMenuItemContentVue2 };

package/dist/es/columnMenu/GridColumnMenuItemContent.js

@@ -5,7 +5,7 @@ var gh = allVue.h;
 import { getDefaultSlots } from '@progress/kendo-vue-common';
 import { Reveal } from '@progress/kendo-vue-animation';
 /**
- * Represents the default `GridColumnMenuItemContent` component.
+ * @hidden
  */
 
 var GridColumnMenuItemContentVue2 = {
@@ -42,5 +42,9 @@ var GridColumnMenuItemContentVue2 = {
     } : [_this.$props.show ? defaultSlot : null])]);
   }
 };
+/**
+ * @hidden
+ */
+
 var GridColumnMenuItemContent = GridColumnMenuItemContentVue2;
 export { GridColumnMenuItemContent, GridColumnMenuItemContentVue2 };

package/dist/es/columnMenu/GridColumnMenuItemGroup.d.ts

@@ -9,8 +9,11 @@ declare type DefaultMethods<V> = {
 export interface GridColumnMenuItemGroupProps {
 }
 /**
- * The GridColumnMenuItemGroup that will be used inside the Grid ColumnMenu.
+ * @hidden
  */
 declare let GridColumnMenuItemGroupVue2: ComponentOptions<Vue2type, DefaultData<{}>, DefaultMethods<{}>, {}, RecordPropsDefinition<GridColumnMenuItemGroupProps>>;
+/**
+ * @hidden
+ */
 declare const GridColumnMenuItemGroup: DefineComponent<GridColumnMenuItemGroupProps, any, {}, {}, {}, {}, {}, {}, string, GridColumnMenuItemGroupProps, GridColumnMenuItemGroupProps, {}>;
 export { GridColumnMenuItemGroup, GridColumnMenuItemGroupVue2 };

package/dist/es/columnMenu/GridColumnMenuItemGroup.js

@@ -4,7 +4,7 @@ var allVue = Vue;
 var gh = allVue.h;
 import { getDefaultSlots } from '@progress/kendo-vue-common';
 /**
- * The GridColumnMenuItemGroup that will be used inside the Grid ColumnMenu.
+ * @hidden
  */
 
 var GridColumnMenuItemGroupVue2 = {
@@ -24,5 +24,9 @@ var GridColumnMenuItemGroupVue2 = {
     }, [defaultSlot]);
   }
 };
+/**
+ * @hidden
+ */
+
 var GridColumnMenuItemGroup = GridColumnMenuItemGroupVue2;
 export { GridColumnMenuItemGroup, GridColumnMenuItemGroupVue2 };

package/dist/es/columnMenu/GridColumnMenuSort.d.ts

@@ -6,7 +6,7 @@ declare type DefaultMethods<V> = {
 import { SortDescriptor } from '@progress/kendo-data-query';
 import { GridColumnMenuSortBaseProps } from '../interfaces/GridColumnMenuSortBaseProps';
 /**
- * Can be used to check if sorting is applied to a specific field ([see example]({% slug column_menu_grid_native %}#toc-styling-the-column-menu-icon)). Useful for creating active sort indicators.
+ * Can be used to check if sorting is applied to a specific field ([see example]({% slug column_menu_grid %}#toc-styling-the-column-menu-icon)). Useful for creating active sort indicators.
  */
 export declare const sortGroupByField: (field: string, sort?: SortDescriptor[]) => boolean;
 /**
@@ -143,8 +143,141 @@ export interface GridColumnMenuSortMethods extends Vue2type {
     onSort: (e: any, selectedDir: 'asc' | 'desc') => void;
 }
 /**
- * Represents the default `GridColumnMenuSort` component.
+ * @hidden
  */
 declare let GridColumnMenuSortVue2: ComponentOptions<Vue2type, DefaultData<{}>, DefaultMethods<GridColumnMenuSortMethods>, {}, RecordPropsDefinition<GridColumnMenuSortProps>>;
+/**
+ *
+ *
+ * {% meta height:410 %}
+ *  ```html-preview
+ *  <div id="vueapp">
+ *     <Grid :style="{height: '280px'}"
+ *          :data-items="gridData"
+ *          :sortable="true"
+ *          :sort= "sort"
+ *          :filter="filter"
+ *          :expand-field="'Discontinued'"
+ *          @datastatechange="dataStateChange"
+ *          @expandchange="expandChange"
+ *          :columns="columns">
+ *       </Grid>
+ *  </div>
+ * ```
+ * ```js
+ * import { Grid, GridColumnMenuSort } from '@progress/kendo-vue-grid';
+ * import { process } from '@progress/kendo-data-query';
+ *      const ColumnMenu = {
+ *        props: {
+ *            column: Object,
+ *            sortable: [Boolean, Object],
+ *            sort: {
+ *                type: Array
+ *            },
+ *            filter: Object,
+ *            filterable: Boolean
+ *        },
+ *        components: {
+ *            GridColumnMenuSort
+ *        },
+ *        template: `<div>
+ *            <GridColumnMenuSort
+ *                :column="column"
+ *                :filterable="filterable"
+ *                :filter="filter"
+ *                @closemenu ="closeMenu"
+ *                @sortchange = "sortChange"
+ *            />
+ *        </div>`,
+ *        methods: {
+ *            closeMenu () {
+ *                this.$emit('closemenu');
+ *            },
+ *            sortChange (newDescriptor, e) {
+ *                this.$emit('filterchange', newDescriptor, e);
+ *            }
+ *        }
+ *      };
+ *
+ *      Vue.component('Grid', Grid);
+ *      new Vue({
+ *          el: '#vueapp',
+ *          components: {
+ *            Grid
+ *          },
+ *          created: function() {
+ *             this.getData();
+ *          },
+ *          methods: {
+ *            getData: function () {
+ *                let dataState = {
+ *                    filter: this.filter,
+ *                    sort: this.sort
+ *                };
+ *                this.gridData = process([{
+ *                    "ProductID": 1,
+ *                    "ProductName": "Chai",
+ *                    "UnitsInStock": 39,
+ *                    "Discontinued": false,
+ *                    "FirstOrderedOn": new Date(1996, 8, 20)
+ *                },{
+ *                    "ProductID": 2,
+ *                    "ProductName": "Chang",
+ *                    "UnitsInStock": 17,
+ *                    "Discontinued": false,
+ *                    "FirstOrderedOn": new Date(1996, 7, 12)
+ *                },{
+ *                    "ProductID": 3,
+ *                    "ProductName": "Aniseed Syrup",
+ *                    "UnitsInStock": 13,
+ *                    "Discontinued": false,
+ *                    "FirstOrderedOn": new Date(1996, 8, 26)
+ *                },{
+ *                    "ProductID": 4,
+ *                    "ProductName": "Chef Anton's Cajun Seasoning",
+ *                    "UnitsInStock": 53,
+ *                    "Discontinued": false,
+ *                    "FirstOrderedOn": new Date(1996, 9, 19)
+ *                }], dataState);
+ *            },
+ *            createAppState: function(dataState) {
+ *                this.sort = dataState.sort;
+ *                this.filter = dataState.filter;
+ *                this.getData();
+ *            },
+ *            dataStateChange: function (event) {
+ *                this.createAppState(event.data);
+ *            },
+ *            expandChange: function (event) {
+ *                 event.dataItem[event.target.$props.expandField] = event.value;
+ *                 //
+ *                 // In Vue 2 context, instead of the above line, inside the expandChange method we should have the following:
+ *                 //
+ *                 //   Vue.set(
+ *                 //     event.dataItem,
+ *                 //     event.target.$props.expandField,
+ *                 //     event.dataItem.expanded === undefined ? false : !event.dataItem.expanded
+ *                 //   );
+ *                 //
+ *            }
+ *          },
+ *          data: function () {
+ *              return {
+ *                 filter: null,
+ *                 sort: [],
+ *                  gridData: [],
+ *                  columns: [
+ *                      { field: 'ProductID'},
+ *                      { field: 'ProductName', title: 'Product Name' },
+ *                      { field: 'UnitsInStock', title: 'Units In Stock', columnMenu: ColumnMenu }
+ *                  ]
+ *              };
+ *          }
+ *       } );
+ * ```
+ *
+ *
+ * ### props <span class='code'>[GridColumnMenuSortProps]({% slug api_grid_columnmenusortprops %})</span>
+ */
 declare const GridColumnMenuSort: DefineComponent<GridColumnMenuSortProps, any, {}, {}, GridColumnMenuSortMethods, {}, {}, {}, string, GridColumnMenuSortProps, GridColumnMenuSortProps, {}>;
 export { GridColumnMenuSort, GridColumnMenuSortVue2 };

package/dist/es/columnMenu/GridColumnMenuSort.js

@@ -84,7 +84,7 @@ var sortedDesc = function sortedDesc(sortedIndex, sort) {
 }; // tslint:disable:max-line-length
 
 /**
- * Can be used to check if sorting is applied to a specific field ([see example]({% slug column_menu_grid_native %}#toc-styling-the-column-menu-icon)). Useful for creating active sort indicators.
+ * Can be used to check if sorting is applied to a specific field ([see example]({% slug column_menu_grid %}#toc-styling-the-column-menu-icon)). Useful for creating active sort indicators.
  */
 // tslint:enable:max-line-length
 
@@ -94,7 +94,7 @@ export var sortGroupByField = function sortGroupByField(field, sort) {
   return sortedDesc(currentSortIndex, sort) || sortedAsc(currentSortIndex, sort);
 };
 /**
- * Represents the default `GridColumnMenuSort` component.
+ * @hidden
  */
 
 var GridColumnMenuSortVue2 = {
@@ -236,5 +236,139 @@ var GridColumnMenuSortVue2 = {
     );
   }
 };
+/**
+ *
+ *
+ * {% meta height:410 %}
+ *  ```html-preview
+ *  <div id="vueapp">
+ *     <Grid :style="{height: '280px'}"
+ *          :data-items="gridData"
+ *          :sortable="true"
+ *          :sort= "sort"
+ *          :filter="filter"
+ *          :expand-field="'Discontinued'"
+ *          @datastatechange="dataStateChange"
+ *          @expandchange="expandChange"
+ *          :columns="columns">
+ *       </Grid>
+ *  </div>
+ * ```
+ * ```js
+ * import { Grid, GridColumnMenuSort } from '@progress/kendo-vue-grid';
+ * import { process } from '@progress/kendo-data-query';
+ *      const ColumnMenu = {
+ *        props: {
+ *            column: Object,
+ *            sortable: [Boolean, Object],
+ *            sort: {
+ *                type: Array
+ *            },
+ *            filter: Object,
+ *            filterable: Boolean
+ *        },
+ *        components: {
+ *            GridColumnMenuSort
+ *        },
+ *        template: `<div>
+ *            <GridColumnMenuSort
+ *                :column="column"
+ *                :filterable="filterable"
+ *                :filter="filter"
+ *                @closemenu ="closeMenu"
+ *                @sortchange = "sortChange"
+ *            />
+ *        </div>`,
+ *        methods: {
+ *            closeMenu () {
+ *                this.$emit('closemenu');
+ *            },
+ *            sortChange (newDescriptor, e) {
+ *                this.$emit('filterchange', newDescriptor, e);
+ *            }
+ *        }
+ *      };
+ *
+ *      Vue.component('Grid', Grid);
+ *      new Vue({
+ *          el: '#vueapp',
+ *          components: {
+ *            Grid
+ *          },
+ *          created: function() {
+ *             this.getData();
+ *          },
+ *          methods: {
+ *            getData: function () {
+ *                let dataState = {
+ *                    filter: this.filter,
+ *                    sort: this.sort
+ *                };
+ *                this.gridData = process([{
+ *                    "ProductID": 1,
+ *                    "ProductName": "Chai",
+ *                    "UnitsInStock": 39,
+ *                    "Discontinued": false,
+ *                    "FirstOrderedOn": new Date(1996, 8, 20)
+ *                },{
+ *                    "ProductID": 2,
+ *                    "ProductName": "Chang",
+ *                    "UnitsInStock": 17,
+ *                    "Discontinued": false,
+ *                    "FirstOrderedOn": new Date(1996, 7, 12)
+ *                },{
+ *                    "ProductID": 3,
+ *                    "ProductName": "Aniseed Syrup",
+ *                    "UnitsInStock": 13,
+ *                    "Discontinued": false,
+ *                    "FirstOrderedOn": new Date(1996, 8, 26)
+ *                },{
+ *                    "ProductID": 4,
+ *                    "ProductName": "Chef Anton's Cajun Seasoning",
+ *                    "UnitsInStock": 53,
+ *                    "Discontinued": false,
+ *                    "FirstOrderedOn": new Date(1996, 9, 19)
+ *                }], dataState);
+ *            },
+ *            createAppState: function(dataState) {
+ *                this.sort = dataState.sort;
+ *                this.filter = dataState.filter;
+ *                this.getData();
+ *            },
+ *            dataStateChange: function (event) {
+ *                this.createAppState(event.data);
+ *            },
+ *            expandChange: function (event) {
+ *                 event.dataItem[event.target.$props.expandField] = event.value;
+ *                 //
+ *                 // In Vue 2 context, instead of the above line, inside the expandChange method we should have the following:
+ *                 //
+ *                 //   Vue.set(
+ *                 //     event.dataItem,
+ *                 //     event.target.$props.expandField,
+ *                 //     event.dataItem.expanded === undefined ? false : !event.dataItem.expanded
+ *                 //   );
+ *                 //
+ *            }
+ *          },
+ *          data: function () {
+ *              return {
+ *                 filter: null,
+ *                 sort: [],
+ *                  gridData: [],
+ *                  columns: [
+ *                      { field: 'ProductID'},
+ *                      { field: 'ProductName', title: 'Product Name' },
+ *                      { field: 'UnitsInStock', title: 'Units In Stock', columnMenu: ColumnMenu }
+ *                  ]
+ *              };
+ *          }
+ *       } );
+ * ```
+ *
+ *
+ * ### props <span class='code'>[GridColumnMenuSortProps]({% slug api_grid_columnmenusortprops %})</span>
+ */
+
 var GridColumnMenuSort = GridColumnMenuSortVue2;
 export { GridColumnMenuSort, GridColumnMenuSortVue2 };

package/dist/es/drag/ColumnDraggable.d.ts

@@ -33,8 +33,11 @@ export interface ColumnDraggableState {
 export interface ColumnDraggableAll extends ColumnDraggableMethods, ColumnDraggableState {
 }
 /**
- * Represents the default `ColumnDraggable` component.
+ * @hidden
  */
 declare let ColumnDraggableVue2: ComponentOptions<Vue2type, DefaultData<{}>, DefaultMethods<ColumnDraggableAll>, {}, RecordPropsDefinition<ColumnDraggableProps>>;
+/**
+ * @hidden
+ */
 declare const ColumnDraggable: DefineComponent<ColumnDraggableProps, any, {}, {}, ColumnDraggableMethods, {}, {}, {}, string, ColumnDraggableProps, ColumnDraggableProps, {}>;
 export { ColumnDraggable, ColumnDraggableVue2 };

package/dist/es/drag/ColumnDraggable.js

@@ -4,7 +4,7 @@ var allVue = Vue;
 var gh = allVue.h;
 import { getDefaultSlots, Draggable } from '@progress/kendo-vue-common';
 /**
- * Represents the default `ColumnDraggable` component.
+ * @hidden
  */
 
 var ColumnDraggableVue2 = {
@@ -64,5 +64,9 @@ var ColumnDraggableVue2 = {
     );
   }
 };
+/**
+ * @hidden
+ */
+
 var ColumnDraggable = ColumnDraggableVue2;
 export { ColumnDraggable, ColumnDraggableVue2 };