@progress/kendo-vue-grid 3.5.0 → 3.5.1-dev.202208150613

package/dist/esm/utils/index.d.ts

@@ -0,0 +1,91 @@
+import { GridProps } from '../interfaces/GridProps';
+import { ExtendedColumnProps } from '../interfaces/ExtendedColumnProps';
+import { DataResult, GroupDescriptor } from '@progress/kendo-data-query';
+import { GridRowType } from '../interfaces/GridRowType';
+import { GridColumnProps } from '../interfaces/GridColumnProps';
+import { IntlService } from '@progress/kendo-vue-intl';
+/**
+ * @hidden
+ */
+export declare function getNestedValue(fieldName: string, dataItem: any): any;
+/**
+ * @hidden
+ */
+export interface DataItemWrapper {
+    dataItem: any;
+    rowType: GridRowType;
+    level: number;
+    expanded: boolean;
+    dataIndex: number;
+}
+/**
+ * @hidden
+ */
+export declare function flatData(output: Array<DataItemWrapper>, input: Array<any>, footer: 'always' | 'visible' | 'none', dataIndex: {
+    index: number;
+}, groupDefined: boolean, field?: string, level?: number): number;
+/**
+ * @hidden
+ */
+export declare function isRtl(element: Element | null): boolean;
+/**
+ * @hidden
+ */
+export declare function getIndex(event: any, parent: HTMLElement | null): number;
+/**
+ * @hidden
+ */
+export declare function checkPropCompatibility(props: GridProps): void;
+/**
+ * @hidden
+ */
+export declare function mapColumns(columns: Array<{
+    parentIndex: number;
+    colSpan: number;
+    rowSpan: number;
+    depth: number;
+    kFirst?: boolean;
+    children: any[];
+    width?: string | number;
+    locked?: boolean;
+    index: number;
+    left: number;
+    right: number;
+    rightBorder: boolean;
+}>): number[][];
+/**
+ * @hidden
+ */
+export declare function readColumns(newColumns: GridColumnProps[] | null | undefined, oldColumns: GridColumnProps[], idInfo: {
+    prevId: number;
+    idPrefix: string;
+}, depth?: number): ExtendedColumnProps[];
+/**
+ * @hidden
+ */
+export declare function autoGenerateColumns(data: any[] | DataResult | null | undefined, group: GroupDescriptor[] | undefined, expandField: string | undefined, idInfo: {
+    prevId: number;
+    idPrefix: string;
+}): ExtendedColumnProps[];
+/**
+ * @hidden
+ */
+export declare const footerColumns: (columns: ExtendedColumnProps[]) => ExtendedColumnProps[];
+/**
+ * @hidden
+ */
+export declare const parsers: {
+    number: (value: any, intl: IntlService, format?: string) => number;
+    date: (value: any, intl: IntlService, format?: string) => Date;
+    boolean: (value: any) => any;
+    string: (value: any) => any;
+    default: (value: any) => any;
+};
+/**
+ * @hidden
+ */
+export declare function applyExpandedState(sdata: DataResult, collapsed: any[], uniqueField: string): DataResult;
+/**
+ * @hidden
+ */
+export declare function groupedFirstItemValue(item: any, field: string): any;

package/dist/esm/utils/index.js

@@ -0,0 +1,393 @@
+import { tableKeyboardNavigationTools as navigationTools } from '@progress/kendo-vue-data-tools';
+import { canUseDOM } from '@progress/kendo-vue-common';
+var STRING = 'string';
+/**
+ * @hidden
+ */
+export function getNestedValue(fieldName, dataItem) {
+    var path = fieldName.split('.');
+    var data = dataItem;
+    path.forEach(function (p) {
+        data = data ? data[p] : undefined;
+    });
+    return data;
+}
+/**
+ * @hidden
+ */
+export function flatData(output, input, footer, dataIndex, groupDefined, field, level) {
+    if (level === void 0) { level = 0; }
+    var maxLevel = level;
+    for (var i = 0; i < input.length; i++) {
+        if (!groupDefined || input[i].value === undefined || input[i].items === undefined) {
+            output[output.length] = {
+                dataIndex: ++dataIndex.index,
+                dataItem: input[i],
+                rowType: 'data',
+                level: level,
+                expanded: field === undefined || getNestedValue(field, input[i])
+            };
+            continue;
+        }
+        maxLevel = Math.max(maxLevel, level + 1);
+        var expanded = field === undefined ||
+            getNestedValue(field, input[i]) === undefined ||
+            getNestedValue(field, input[i]);
+        // header
+        output[output.length] = {
+            dataIndex: -1,
+            dataItem: input[i],
+            level: level,
+            rowType: 'groupHeader',
+            expanded: expanded
+        };
+        // children
+        if (expanded) {
+            maxLevel = Math.max(flatData(output, input[i].items, footer, dataIndex, groupDefined, field, level + 1), maxLevel);
+        }
+        // footer
+        if (footer === 'always' || (expanded && footer === 'visible')) {
+            output[output.length] = {
+                dataIndex: -1,
+                dataItem: input[i],
+                rowType: 'groupFooter',
+                level: level,
+                expanded: expanded
+            };
+        }
+    }
+    return maxLevel;
+}
+/**
+ * @hidden
+ */
+export function isRtl(element) {
+    return element && (getComputedStyle(element).direction === 'rtl') || false;
+}
+/**
+ * @hidden
+ */
+export function getIndex(event, parent) {
+    if (!parent || !event || !event.originalEvent || !canUseDOM) {
+        return -1;
+    }
+    var target = document.elementFromPoint(event.clientX, event.originalEvent.clientY);
+    while (target && target.parentElement !== parent) {
+        target = target.parentElement;
+    }
+    var children = parent.children;
+    for (var i = 0; i < children.length; i++) {
+        if (children[i] === target) {
+            return i;
+        }
+    }
+    return -1;
+}
+var eventKeys = [
+    'sortChange',
+    'filterChange',
+    'groupChange',
+    'pageChange',
+    'expandChange',
+    'selectionChange',
+    'headerSelectionChange',
+    'rowClick',
+    'itemChange',
+    'dataStateChange',
+    'columnResize',
+    'columnReorder'
+];
+var GridColumnDefaults = {
+    filterable: true,
+    editable: true,
+    sortable: true,
+    resizable: true,
+    reorderable: true,
+    groupable: true
+};
+var deprecatedHandlerMessage = function (oldKey, newKey) { return ("The ".concat(oldKey, " event handler property is deprecated, ") +
+    "use https://www.telerik.com/kendo-vue-ui/components/grid/api/GridProps/#toc-".concat(newKey, " instead")); };
+/**
+ * @hidden
+ */
+export function checkPropCompatibility(props) {
+    for (var index = 0; index < eventKeys.length; index++) {
+        var eventKey = eventKeys[index];
+        if (props[eventKey] !== undefined) {
+            var newKey = 'on' + eventKey.charAt(0).toUpperCase() + eventKey.slice(1);
+            console.warn(deprecatedHandlerMessage(eventKey, newKey));
+        }
+    }
+}
+function nextColumn(columns, current) {
+    var currentDepth = columns[current].depth;
+    var next = null;
+    for (var index = current + 1; index < columns.length; index++) {
+        if (columns[index].depth === currentDepth) {
+            next = columns[index];
+            break;
+        }
+    }
+    return next;
+}
+/**
+ * @hidden
+ */
+export function mapColumns(columns) {
+    var columnsMap = [[]];
+    var maxDepth = 0;
+    // set colspans, get maxdepth
+    for (var q = columns.length - 1; q >= 0; q--) {
+        maxDepth = Math.max(maxDepth, columns[q].depth);
+        columns[q].colSpan = columns[q].colSpan || 1;
+        if (columns[q].parentIndex !== -1) {
+            columns[columns[q].parentIndex].colSpan =
+                (columns[columns[q].parentIndex].colSpan || 0) + columns[q].colSpan;
+        }
+    }
+    var rowSpan = 1;
+    // set rowspan, kFirst, index AND create columnsMap
+    columns.forEach(function (column, i) {
+        columnsMap[column.depth] = columnsMap[column.depth] || [];
+        var needKFirst = false;
+        if (columnsMap[column.depth].length === 0) {
+            if (rowSpan <= 1) {
+                rowSpan = 1 + (column.children.length > 0 ? 0 : maxDepth - column.depth);
+            }
+            else {
+                rowSpan--;
+                needKFirst = true;
+            }
+        }
+        column.rowSpan = 1 + (column.children.length > 0 ? 0 : maxDepth - column.depth);
+        column.kFirst = needKFirst;
+        column.index = columnsMap[column.depth].length;
+        columnsMap[column.depth].push(i);
+    });
+    var stickyLeftWidth = new Array(columnsMap.length).fill(0);
+    var width = 0;
+    // set left AND create stickyLeftWidth
+    columns.forEach(function (column) {
+        if (column.locked) {
+            column.left = stickyLeftWidth[column.depth];
+            width = column.width ? parseFloat(column.width.toString()) : 0;
+            if (column.children.length === 0) {
+                for (var i = column.depth; i < stickyLeftWidth.length; i++) {
+                    stickyLeftWidth[i] += width;
+                }
+            }
+            else {
+                stickyLeftWidth[column.depth] += width;
+            }
+        }
+    });
+    var stickyRightWidth = new Array(columnsMap.length).fill(0);
+    // set right, rightBorder AND create stickyRightWidth
+    for (var i = columns.length - 1; i >= 0; i--) {
+        var column = columns[i];
+        if (column.locked) {
+            column.right = stickyRightWidth[column.depth];
+            width = column.width ? parseFloat(column.width.toString()) : 0;
+            if (column.children.length === 0) {
+                for (var j = column.depth; j < stickyRightWidth.length; j++) {
+                    stickyRightWidth[j] += width;
+                }
+            }
+            else {
+                stickyRightWidth[column.depth] += width;
+            }
+            var next = nextColumn(columns, i);
+            column.rightBorder = !(next && next.locked);
+        }
+    }
+    return columnsMap;
+}
+/**
+ * @hidden
+ */
+export function readColumns(newColumns, oldColumns, idInfo, depth) {
+    if (depth === void 0) { depth = 0; }
+    var columns = [];
+    var sameLength = (newColumns && newColumns.length) ? newColumns.length === oldColumns.length : false;
+    if (!newColumns) {
+        return [];
+    }
+    if (newColumns && newColumns.length === undefined) {
+        newColumns = [newColumns];
+    }
+    // @ts-ignore
+    newColumns.forEach(function (columnProps, index) {
+        columnProps = columnProps;
+        var oldColumn = sameLength ? oldColumns[index] || null : null;
+        var notHiddenChildren = columnProps.children ?
+            columnProps.children.filter(function (column) { return !column.hidden; }) : columnProps.children;
+        var c = readColumns(notHiddenChildren, oldColumn && oldColumn.children || [], idInfo, depth + 1);
+        columns.push(Object.assign({ depth: depth }, GridColumnDefaults, (c.length) ? { cell: function () { return null; }, filterCell: function () { return null; } } : {}, oldColumn ? { width: oldColumn.width, orderIndex: oldColumn.orderIndex } : {}, columnProps, {
+            id: navigationTools.generateNavigatableId("".concat(idInfo.prevId++), idInfo.idPrefix, 'column'),
+            declarationIndex: columns.length,
+            children: c,
+            rowSpan: 0,
+            colSpan: 0,
+            isAccessible: true
+        }));
+    });
+    var comparator = function (a, b) {
+        return a.orderIndex === b.orderIndex ?
+            a.declarationIndex - b.declarationIndex :
+            ((a.orderIndex || 0) - (b.orderIndex || 0));
+    };
+    columns.sort(comparator);
+    if (depth === 0) {
+        var ret_1 = [];
+        var flat_1 = function (cols, pIndex) {
+            return cols.forEach(function (c) {
+                c.parentIndex = pIndex;
+                flat_1(c.children, ret_1.push(c) - 1);
+            });
+        };
+        flat_1(columns, -1);
+        return ret_1;
+    }
+    return columns;
+}
+/**
+ * @hidden
+ */
+export function autoGenerateColumns(data, group, expandField, idInfo) {
+    var propData = [];
+    if (Array.isArray(data)) {
+        propData = data;
+    }
+    else if (data) {
+        propData = data.data;
+    }
+    if (!propData.length) {
+        console.warn('Kendo Grid autogeneration of columns is only possible if some items are defined when the component is created.');
+    }
+    var columns = [];
+    if (propData.length > 0) {
+        var itemForColumnsGen = propData[0];
+        if (group) {
+            for (var i = 0; i < group.length; i++) {
+                itemForColumnsGen = itemForColumnsGen.items && itemForColumnsGen.items[0];
+            }
+        }
+        var fields = Object.getOwnPropertyNames(itemForColumnsGen);
+        fields.forEach(function (field) {
+            if (field !== expandField && field !== '__ob__') {
+                columns.push(Object.assign({
+                    id: navigationTools.generateNavigatableId("".concat(idInfo.prevId++), idInfo.idPrefix, 'column'),
+                    declarationIndex: -1,
+                    parentIndex: -1,
+                    depth: 0,
+                    colSpan: 0,
+                    rowSpan: 0,
+                    index: 0,
+                    left: 0,
+                    right: 0,
+                    children: [],
+                    rightBorder: false,
+                    ariaColumnIndex: 0,
+                    isAccessible: true
+                }, GridColumnDefaults, { field: field }));
+            }
+        });
+    }
+    return columns;
+}
+var hasParentFooterCell = function (columns, column) {
+    var parent = columns[column.parentIndex];
+    while (parent) {
+        if (parent.footerCell) {
+            return true;
+        }
+        parent = columns[parent.parentIndex];
+    }
+    return false;
+};
+/**
+ * @hidden
+ */
+export var footerColumns = function (columns) {
+    return columns.filter(function (column) {
+        if (hasParentFooterCell(columns, column)) {
+            return false;
+        }
+        return Boolean(column.footerCell) || !(column.children && column.children.length > 0);
+    });
+};
+/**
+ * @hidden
+ */
+export var parsers = {
+    'number': function (value, intl, format) {
+        if (typeof value === STRING && value.toLowerCase() === 'null') {
+            return null;
+        }
+        return intl.parseNumber(value, format);
+    },
+    'date': function (value, intl, format) {
+        if (typeof value === STRING && value.toLowerCase() === 'null') {
+            return null;
+        }
+        return intl.parseDate(value, format);
+    },
+    'boolean': function (value) {
+        if (typeof value === STRING) {
+            if (value.toLowerCase() === 'null') {
+                return null;
+            }
+            else {
+                return value.toLowerCase() === 'true';
+            }
+        }
+        return value != null ? !!value : value;
+    },
+    'string': function (value) {
+        if (typeof value === STRING && value.toLowerCase() === 'null') {
+            return null;
+        }
+        return value != null ? (value + '') : value;
+    },
+    'default': function (value) {
+        return value;
+    }
+};
+/**
+ * @hidden
+ */
+function updateItemsExpanded(items, collapsed, uniqueField, level) {
+    items.forEach(function (di) {
+        di.expanded = collapsed[level] && !collapsed[level].includes(groupedFirstItemValue(di, uniqueField));
+        if (di.items && di.items.length) {
+            di.items = updateItemsExpanded(di.items, collapsed, uniqueField, level + 1);
+        }
+    });
+    return items;
+}
+/**
+ * @hidden
+ */
+export function applyExpandedState(sdata, collapsed, uniqueField) {
+    if (collapsed && collapsed.length) {
+        sdata.data.forEach(function (di) {
+            di.expanded = di.expanded !== undefined
+                ? di.expanded
+                : collapsed[0] && !collapsed[0].includes(groupedFirstItemValue(di, uniqueField));
+            if (di.items && di.items.length) {
+                di.items = updateItemsExpanded(di.items, collapsed, uniqueField, 1);
+            }
+        });
+    }
+    return sdata;
+}
+/**
+ * @hidden
+ */
+export function groupedFirstItemValue(item, field) {
+    var resultItem = item;
+    while (resultItem.items && resultItem.items.length) {
+        resultItem = resultItem.items[0];
+    }
+    return field ? resultItem[field] : item.value;
+}