@progress/kendo-vue-data-tools 5.3.0-dev.202410141143 → 5.3.0-develop.1

package/dist/es/columnmenu/ColumnMenuSort.js

@@ -1,368 +0,0 @@
-// @ts-ignore
-import * as Vue from 'vue';
-var allVue = Vue;
-var gh = allVue.h;
-var isV3 = allVue.version && allVue.version[0] === '3';
-var inject = allVue.inject;
-import { ColumnMenuItem } from './ColumnMenuItem';
-import { ColumnMenuItemGroup } from './ColumnMenuItemGroup';
-import { normalize } from '../interfaces/SortSettings';
-import { provideLocalizationService } from '@progress/kendo-vue-intl';
-import { messages, columnMenuSortAscending as sortAscending, columnMenuSortDescending as sortDescending } from '../messages/main';
-import { hasListener } from '@progress/kendo-vue-common';
-import { sortAscSmallIcon, sortDescSmallIcon } from '@progress/kendo-svg-icons';
-/**
- * @hidden
- */
-var ASC_DIR = 'asc';
-/**
- * @hidden
- */
-var DESC_DIR = 'desc';
-/**
- * @hidden
- */
-var sortSeqMap = {
-  true: {
-    'asc': {
-      'asc': '',
-      'desc': 'desc'
-    },
-    'desc': {
-      'asc': 'asc',
-      'desc': ''
-    },
-    '': {
-      'asc': 'asc',
-      'desc': 'desc'
-    }
-  },
-  false: {
-    'asc': {
-      'asc': 'asc',
-      'desc': 'desc'
-    },
-    'desc': {
-      'asc': 'asc',
-      'desc': 'desc'
-    },
-    '': {
-      'asc': 'asc',
-      'desc': 'desc'
-    }
-  }
-};
-/**
- * @hidden
- */
-var sortIndex = function sortIndex(field, sort) {
-  if (!sort) {
-    return -1;
-  }
-  return sort.findIndex(function (s) {
-    return s.field === field;
-  });
-};
-/**
- * @hidden
- */
-var sortedAsc = function sortedAsc(sortedIndex, sort) {
-  return !!(sort && sortedIndex > -1 && sort[sortedIndex].dir === ASC_DIR);
-};
-/**
- * @hidden
- */
-var sortedDesc = function sortedDesc(sortedIndex, sort) {
-  return !!(sort && sortedIndex > -1 && sort[sortedIndex].dir === DESC_DIR);
-};
-// tslint:disable:max-line-length
-/**
- * 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
-export var sortGroupByField = function sortGroupByField(field, sort) {
-  var currentSortIndex = sortIndex(field, sort);
-  return sortedDesc(currentSortIndex, sort) || sortedAsc(currentSortIndex, sort);
-};
-/**
- * @hidden
- */
-var ColumnMenuSortVue2 = {
-  props: {
-    sortable: [Boolean, Object],
-    sort: {
-      type: Array
-    },
-    column: Object,
-    onSortchange: Function
-  },
-  inject: {
-    kendoLocalizationService: {
-      default: null
-    }
-  },
-  methods: {
-    onAscClick: function onAscClick(e) {
-      this.onSort(e, ASC_DIR);
-      this.$emit('closemenu');
-    },
-    onDescClick: function onDescClick(e) {
-      this.onSort(e, DESC_DIR);
-      this.$emit('closemenu');
-    },
-    onSort: function onSort(e, selectedDir) {
-      e.preventDefault();
-      if (!hasListener.call(this, 'sortchange')) {
-        return;
-      }
-      var _a = this.$props,
-        column = _a.column,
-        sortable = _a.sortable,
-        sort = _a.sort;
-      var _b = normalize(sortable || false, false),
-        allowUnsort = _b.allowUnsort,
-        mode = _b.mode;
-      var oldDescriptor = (sort || []).filter(function (d) {
-        return d.field === column.field;
-      })[0];
-      var dir = sortSeqMap[allowUnsort][oldDescriptor && oldDescriptor.dir || ''][selectedDir];
-      var newDescriptor = mode === 'single' ? [] : (this.$props.sort || []).filter(function (d) {
-        return d.field !== column.field;
-      });
-      if (dir !== '' && column.field) {
-        newDescriptor.push({
-          field: column.field,
-          dir: dir
-        });
-      }
-      this.$emit('sortchange', newDescriptor, {
-        event: e,
-        field: this.$props.column.field
-      });
-    }
-  },
-  // @ts-ignore
-  setup: !isV3 ? undefined : function () {
-    var v3 = !!isV3;
-    var kendoLocalizationService = inject('kendoLocalizationService', {});
-    return {
-      v3: v3,
-      kendoLocalizationService: kendoLocalizationService
-    };
-  },
-  // @ts-ignore
-  render: function render(createElement) {
-    var _this = this;
-    var h = gh || createElement;
-    var _a = this.$props,
-      sort = _a.sort,
-      column = _a.column;
-    var currentSortIndex = sortIndex(column.field, sort);
-    var localizationService = provideLocalizationService(this);
-    return (
-      // @ts-ignore function children
-      h(ColumnMenuItemGroup, this.v3 ? function () {
-        return [
-        // @ts-ignore
-        h(ColumnMenuItem, {
-          title: localizationService.toLanguageString(sortAscending, messages[sortAscending]),
-          attrs: _this.v3 ? undefined : {
-            title: localizationService.toLanguageString(sortAscending, messages[sortAscending]),
-            icon: 'sort-asc-small',
-            svgIcon: sortAscSmallIcon,
-            selected: sortedAsc(currentSortIndex, sort)
-          },
-          icon: 'sort-asc-small',
-          svgIcon: sortAscSmallIcon,
-          selected: sortedAsc(currentSortIndex, sort),
-          onMenuitemclick: _this.onAscClick,
-          on: _this.v3 ? undefined : {
-            "menuitemclick": _this.onAscClick
-          }
-        }),
-        // @ts-ignore
-        h(ColumnMenuItem, {
-          title: localizationService.toLanguageString(sortDescending, messages[sortDescending]),
-          attrs: _this.v3 ? undefined : {
-            title: localizationService.toLanguageString(sortDescending, messages[sortDescending]),
-            icon: 'sort-desc-small',
-            svgIcon: sortDescSmallIcon,
-            selected: sortedDesc(currentSortIndex, sort)
-          },
-          icon: 'sort-desc-small',
-          svgIcon: sortDescSmallIcon,
-          selected: sortedDesc(currentSortIndex, sort),
-          onMenuitemclick: _this.onDescClick,
-          on: _this.v3 ? undefined : {
-            "menuitemclick": _this.onDescClick
-          }
-        })];
-      } : [h(ColumnMenuItem, {
-        title: localizationService.toLanguageString(sortAscending, messages[sortAscending]),
-        attrs: _this.v3 ? undefined : {
-          title: localizationService.toLanguageString(sortAscending, messages[sortAscending]),
-          icon: 'sort-asc-small',
-          svgIcon: sortAscSmallIcon,
-          selected: sortedAsc(currentSortIndex, sort)
-        },
-        icon: 'sort-asc-small',
-        svgIcon: sortAscSmallIcon,
-        selected: sortedAsc(currentSortIndex, sort),
-        onMenuitemclick: _this.onAscClick,
-        on: _this.v3 ? undefined : {
-          "menuitemclick": _this.onAscClick
-        }
-      }), h(ColumnMenuItem, {
-        title: localizationService.toLanguageString(sortDescending, messages[sortDescending]),
-        attrs: _this.v3 ? undefined : {
-          title: localizationService.toLanguageString(sortDescending, messages[sortDescending]),
-          icon: 'sort-desc-small',
-          svgIcon: sortDescSmallIcon,
-          selected: sortedDesc(currentSortIndex, sort)
-        },
-        icon: 'sort-desc-small',
-        svgIcon: sortDescSmallIcon,
-        selected: sortedDesc(currentSortIndex, sort),
-        onMenuitemclick: _this.onDescClick,
-        on: _this.v3 ? undefined : {
-          "menuitemclick": _this.onDescClick
-        }
-      })])
-    );
-  }
-};
-/**
- *
- *
- * {% 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 { , ColumnMenuSort } 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: {
- *            ColumnMenuSort
- *        },
- *        template: `<div>
- *            <ColumnMenuSort
- *                :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', );
- *      new Vue({
- *          el: '#vueapp',
- *          components: {
- *
- *          },
- *          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_gridcolumnmenusortprops %})</span>
- */
-var ColumnMenuSort = ColumnMenuSortVue2;
-export { ColumnMenuSort, ColumnMenuSortVue2 };

package/dist/es/columnmenu/main.d.ts

@@ -1,2 +0,0 @@
-export * from './ColumnMenu';
-export * from './ColumnMenuOperators';

package/dist/es/columnmenu/main.js

@@ -1,6 +0,0 @@
-export * from './ColumnMenu';
-// export * from './ColumnMenuFilterForm';
-// export * from './ColumnMenuFilterLogic';
-// export * from './ColumnMenuFilters';
-// export * from './ColumnMenuItem';
-export * from './ColumnMenuOperators';

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

@@ -1,43 +0,0 @@
-import { DefineComponent, RecordPropsDefinition, ComponentOptions, Vue2type } from '../additionalTypes';
-declare type DefaultData<V> = object | ((this: V) => {});
-declare type DefaultMethods<V> = {
-    [key: string]: (this: V, ...args: any[]) => any;
-};
-/**
- * @hidden
- */
-export interface ColumnDraggableProps {
-    key?: any;
-    onPressHandler?: (draggableEvent: any, element: HTMLElement) => void;
-    onDragHandler?: (draggableEvent: any, element: HTMLElement) => void;
-    onReleaseHandler?: (draggableEvent: any) => void;
-}
-/**
- * @hidden
- */
-export interface ColumnDraggableMethods extends Vue2type {
-    onPress: (event: any) => void;
-    onDrag: (event: any) => void;
-    onRelease: (event: any) => void;
-}
-/**
- * @hidden
- */
-export interface ColumnDraggableState {
-    element: any | null;
-    draggable: any;
-}
-/**
- * @hidden
- */
-export interface ColumnDraggableAll extends ColumnDraggableMethods, ColumnDraggableState {
-}
-/**
- * @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

@@ -1,73 +0,0 @@
-// @ts-ignore
-import * as Vue from 'vue';
-var allVue = Vue;
-var gh = allVue.h;
-var isV3 = allVue.version && allVue.version[0] === '3';
-import { getDefaultSlots, Draggable } from '@progress/kendo-vue-common';
-/**
- * @hidden
- */
-var ColumnDraggableVue2 = {
-  mounted: function mounted() {
-    if (this.$el) {
-      this.draggable = this.$refs.draggable;
-    }
-  },
-  methods: {
-    onPress: function onPress(event) {
-      var element = this.draggable && this.draggable.element;
-      if (element) {
-        this.$emit('pressHandler', event, element);
-      }
-    },
-    onDrag: function onDrag(event) {
-      var element = this.draggable && this.draggable.element;
-      if (element) {
-        this.$emit('dragHandler', event, element);
-      }
-    },
-    onRelease: function onRelease(event) {
-      var element = this.draggable && this.draggable.element;
-      if (element) {
-        this.$emit('releaseHandler', event, element);
-      }
-    }
-  },
-  // @ts-ignore
-  setup: !isV3 ? undefined : function () {
-    var v3 = !!isV3;
-    return {
-      v3: v3
-    };
-  },
-  // @ts-ignore
-  render: function render(createElement) {
-    var h = gh || createElement;
-    var defaultSlot = getDefaultSlots(this);
-    return (
-      // @ts-ignore  function children
-      h(Draggable, {
-        onPress: this.onPress,
-        on: this.v3 ? undefined : {
-          "press": this.onPress,
-          "drag": this.onDrag,
-          "release": this.onRelease
-        },
-        onDrag: this.onDrag,
-        onRelease: this.onRelease,
-        ref: 'draggable'
-      }, this.v3 ? function () {
-        return [h("tr", {
-          "class": 'k-table-row'
-        }, [defaultSlot])];
-      } : [h("tr", {
-        "class": 'k-table-row'
-      }, [defaultSlot])])
-    );
-  }
-};
-/**
- * @hidden
- */
-var ColumnDraggable = ColumnDraggableVue2;
-export { ColumnDraggable, ColumnDraggableVue2 };

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

@@ -1,31 +0,0 @@
-import { ExtendedColumnProps } from '../interfaces/ColumnProps';
-/**
- * @hidden
- */
-export declare class ColumnResize {
-    /**
-     * The main `colgroup` of the Grid.
-     */
-    colGroupMain: any | null;
-    /**
-     * The header `colgroup` of the Grid, if any.
-     */
-    colGroupHeader: any | null;
-    /**
-     * The footer `colgroup` of the Grid (if any).
-     */
-    colGroupFooter: any | null;
-    columns: ExtendedColumnProps[];
-    /**
-     * The settings for resizing the Grid.
-     */
-    resizable: boolean;
-    onResize: (index: number, newWidth: number, oldWidth: number, originalEvent: any, end: boolean) => void;
-    private isRtl;
-    constructor(triggerResize: (index: number, newWidth: number, oldWidth: number, originalEvent: any, end: boolean) => void);
-    setIsRtl: (isRtl: boolean) => void;
-    dragHandler(event: any, column: ExtendedColumnProps, dragCue: HTMLSpanElement, end: boolean): void;
-    private fixateInitialWidths;
-    private setWidths;
-    private updateColElements;
-}

package/dist/es/drag/ColumnResize.js

@@ -1,126 +0,0 @@
-/**
- * @hidden
- */
-var ColumnResize = /** @class */ (function () {
-    function ColumnResize(triggerResize) {
-        var _this = this;
-        /**
-         * The settings for resizing the Grid.
-         */
-        this.resizable = false;
-        this.isRtl = false;
-        this.setIsRtl = function (isRtl) {
-            _this.isRtl = isRtl;
-        };
-        this.onResize = triggerResize;
-        this.dragHandler = this.dragHandler.bind(this);
-    }
-    ColumnResize.prototype.dragHandler = function (event, column, dragCue, end) {
-        var e = event.originalEvent;
-        if (!end) {
-            e.preventDefault();
-            e.stopPropagation();
-            e.stopImmediatePropagation();
-        }
-        var tdElement = dragCue.parentElement;
-        if (!tdElement || !tdElement.parentElement) {
-            return;
-        }
-        var oldWidth = tdElement.clientWidth;
-        var newWidth;
-        if (this.isRtl) {
-            newWidth = (dragCue.getBoundingClientRect().right - (dragCue.offsetWidth / 2)) - event.clientX;
-            newWidth += oldWidth;
-        }
-        else {
-            newWidth = oldWidth + event.clientX - dragCue.getBoundingClientRect().left - (dragCue.offsetWidth / 2);
-        }
-        if (!end && Math.abs(newWidth - oldWidth) < 1) {
-            return;
-        }
-        this.fixateInitialWidths(tdElement.parentElement.clientWidth);
-        this.setWidths(column, Math.floor(newWidth) / oldWidth);
-        var index = this.columns.filter(function (c) { return !c.children.length; }).indexOf(column);
-        this.onResize(index, oldWidth, newWidth, e, end);
-    };
-    ColumnResize.prototype.fixateInitialWidths = function (width) {
-        var columns = this.columns.filter(function (c) { return !c.children.length; });
-        var remainingCount = 0;
-        var cols = this.colGroupMain ? this.colGroupMain.children : [];
-        for (var i = 0; i < cols.length; i++) {
-            if (cols[i].width) {
-                width -= parseFloat(cols[i].width);
-            }
-            else {
-                remainingCount++;
-            }
-        }
-        if (remainingCount === 0) {
-            return;
-        }
-        var perCol = Math.floor(width / remainingCount);
-        for (var i = 0; i < cols.length; i++) {
-            var col = cols[i];
-            if (!col.width) {
-                col.width = perCol;
-                columns[i].width = perCol.toString();
-                if (this.colGroupHeader) {
-                    this.colGroupHeader.children[i].width = perCol;
-                }
-                if (this.colGroupFooter) {
-                    this.colGroupFooter.children[i].width = perCol;
-                }
-            }
-        }
-    };
-    ColumnResize.prototype.setWidths = function (column, coef) {
-        var indexInOriginal = this.columns.indexOf(column);
-        var toAdjust = [];
-        var more = column.children.length;
-        for (var i = indexInOriginal + 1; more > 0 && i < this.columns.length; i++, more--) {
-            var cc = this.columns[i];
-            if (!cc.children.length) {
-                toAdjust.push(cc);
-            }
-            else {
-                more += cc.children.length;
-            }
-        }
-        if (toAdjust.length === 0) {
-            toAdjust.push(column);
-        }
-        toAdjust.forEach(function (colToAdjust) {
-            var targetWidth = colToAdjust.width ? parseFloat(colToAdjust.width.toString()) * coef : 0;
-            var min = colToAdjust.minResizableWidth === undefined ? 10 : colToAdjust.minResizableWidth;
-            if (targetWidth < min) {
-                targetWidth = min;
-            }
-            colToAdjust.width = targetWidth;
-        });
-        this.updateColElements(toAdjust);
-    };
-    ColumnResize.prototype.updateColElements = function (affectedColumns) {
-        var columns = this.columns.filter(function (c) { return !c.children.length; });
-        var difference = 1e-10;
-        for (var i = 0; i < affectedColumns.length; i++) {
-            var colIndex = columns.indexOf(affectedColumns[i]);
-            var currentColumnFloatWidth = parseFloat((affectedColumns[i].width || 0).toString());
-            difference += currentColumnFloatWidth - Math.floor(currentColumnFloatWidth);
-            var currentWidth = Math.floor(currentColumnFloatWidth) + Math.floor(difference);
-            difference -= Math.floor(difference);
-            if (this.colGroupMain) {
-                this.colGroupMain.children[colIndex].width = currentWidth + 'px';
-            }
-            if (this.colGroupHeader) {
-                // static headers
-                this.colGroupHeader.children[colIndex].width = currentWidth + 'px';
-            }
-            if (this.colGroupFooter && this.colGroupFooter.children[colIndex]) {
-                // static footers
-                this.colGroupFooter.children[colIndex].width = currentWidth + 'px';
-            }
-        }
-    };
-    return ColumnResize;
-}());
-export { ColumnResize };

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

@@ -1,40 +0,0 @@
-import { DefineComponent, RecordPropsDefinition, ComponentOptions, Vue2type } from '../additionalTypes';
-declare type DefaultData<V> = object | ((this: V) => {});
-declare type DefaultMethods<V> = {
-    [key: string]: (this: V, ...args: any[]) => any;
-};
-/**
- * @hidden
- */
-export interface ColumnResizerProps {
-    key?: number;
-    resize: (event: any, dragCue: Element, end: boolean) => void;
-}
-/**
- * @hidden
- */
-export interface ColumnResizerMethods extends Vue2type {
-    drag: (event: any) => void;
-    release: (event: any) => void;
-}
-/**
- * @hidden
- */
-export interface ColumnResizerState {
-    element: any | null;
-    draggable: any;
-}
-/**
- * @hidden
- */
-export interface ColumnResizerAll extends ColumnResizerMethods, ColumnResizerState {
-}
-/**
- * @hidden
- */
-declare let ColumnResizerVue2: ComponentOptions<Vue2type, DefaultData<{}>, DefaultMethods<ColumnResizerAll>, {}, RecordPropsDefinition<ColumnResizerProps>>;
-/**
- * @hidden
- */
-declare const ColumnResizer: DefineComponent<ColumnResizerProps, any, {}, {}, ColumnResizerMethods, {}, {}, {}, string, ColumnResizerProps, ColumnResizerProps, {}>;
-export { ColumnResizer, ColumnResizerVue2 };