@progress/kendo-react-grid 6.1.1 → 7.0.0-develop.1

package/dist/npm/columnMenu/GridColumnMenuWrapper.js

@@ -1,123 +0,0 @@
-"use strict";
-var __extends = (this && this.__extends) || (function () {
-    var extendStatics = function (d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
-        return extendStatics(d, b);
-    };
-    return function (d, b) {
-        if (typeof b !== "function" && b !== null)
-            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-    };
-})();
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.GridColumnMenuWrapper = void 0;
-var React = require("react");
-var kendo_react_popup_1 = require("@progress/kendo-react-popup");
-var kendo_react_common_1 = require("@progress/kendo-react-common");
-var kendo_svg_icons_1 = require("@progress/kendo-svg-icons");
-var messages_1 = require("../messages");
-var kendo_react_intl_1 = require("@progress/kendo-react-intl");
-/**
- * The GridColumnMenuWrapper component.
- */
-var GridColumnMenuWrapper = /** @class */ (function (_super) {
-    __extends(GridColumnMenuWrapper, _super);
-    function GridColumnMenuWrapper() {
-        var _this = _super !== null && _super.apply(this, arguments) || this;
-        /** @hidden */
-        _this.state = {
-            show: false
-        };
-        /** @hidden */
-        _this._anchor = null;
-        /** @hidden */
-        _this._content = null;
-        /** @hidden */
-        _this.blurTimeout = undefined;
-        /** @hidden */
-        _this.willBlur = false;
-        /** @hidden */
-        _this.blur = function () {
-            if (_this.willBlur) {
-                _this.willBlur = false;
-                return;
-            }
-            clearTimeout(_this.blurTimeout);
-            _this.blurTimeout = window.setTimeout(function () { _this.closeMenu(); });
-        };
-        /** @hidden */
-        _this.focus = function () {
-            clearTimeout(_this.blurTimeout);
-        };
-        /** @hidden */
-        _this.anchorClick = function (event) {
-            event.preventDefault();
-            _this.setState({
-                show: !_this.state.show
-            }, function () { return _this.state.show && _this._content && _this._content.focus(); });
-        };
-        /** @hidden */
-        _this.closeMenu = function () {
-            _this.setState({ show: false });
-        };
-        /** @hidden */
-        _this.onAnchorMouseDown = function (event) {
-            _this.willBlur = _this.state.show && event.currentTarget === _this._anchor;
-        };
-        /** @hidden */
-        _this.onAnchorKeyDown = function (event) {
-            var _a;
-            if (event.keyCode === kendo_react_common_1.Keys.tab) {
-                var elementToFocus = event.target;
-                var parentScroll = elementToFocus && ((_a = elementToFocus.closest('.k-grid')) === null || _a === void 0 ? void 0 : _a.getElementsByClassName('k-grid-content')[0]);
-                var hasHorizontalScrollbar = parentScroll && (parentScroll.scrollWidth > parentScroll.clientWidth);
-                if (hasHorizontalScrollbar) {
-                    elementToFocus.scrollIntoView({ inline: 'center' });
-                }
-            }
-        };
-        return _this;
-    }
-    GridColumnMenuWrapper.prototype.render = function () {
-        var _this = this;
-        var _a = this.props, ColumnMenu = _a.columnMenu, others = __rest(_a, ["columnMenu"]);
-        var column = this.props.column;
-        var localizationService = (0, kendo_react_intl_1.provideLocalizationService)(this);
-        var fieldMessage = column.title || column.field;
-        var field = fieldMessage ? "".concat(fieldMessage, " ") : '';
-        return (React.createElement(React.Fragment, null,
-            React.createElement("a", { className: 'k-grid-header-menu k-grid-column-menu', ref: function (e) { return _this._anchor = e; }, onClick: this.anchorClick, onMouseDown: this.onAnchorMouseDown, onKeyDown: this.onAnchorKeyDown, href: "#", "aria-label": "".concat(field).concat(localizationService.toLanguageString(messages_1.columnMenu, messages_1.messages[messages_1.columnMenu])) },
-                React.createElement(kendo_react_common_1.IconWrap, { name: 'more-vertical', icon: kendo_svg_icons_1.moreVerticalIcon })),
-            React.createElement(kendo_react_popup_1.Popup, { anchor: this._anchor, show: this.state.show },
-                React.createElement("div", { ref: function (e) { return _this._content = e; }, className: 'k-grid-columnmenu-popup', tabIndex: 0, onBlur: this.blur, onFocus: this.focus, style: { outline: 'none' } }, ColumnMenu && (React.createElement(ColumnMenu, __assign({}, others, { onCloseMenu: this.closeMenu })))))));
-    };
-    return GridColumnMenuWrapper;
-}(React.Component));
-exports.GridColumnMenuWrapper = GridColumnMenuWrapper;

package/dist/npm/constants/index.d.ts

@@ -1,6 +0,0 @@
-/** The attribute required by the Grid selection on Grid `tr` elements. */
-export declare const GRID_ROW_INDEX_ATTRIBUTE = "data-grid-row-index";
-/** The attribute required by the Grid selection on Grid `td` elements. */
-export declare const GRID_COL_INDEX_ATTRIBUTE = "data-grid-col-index";
-/** Attribute which disable selection start from this element. */
-export declare const GRID_PREVENT_SELECTION_ELEMENT = "data-prevent-selection";

package/dist/npm/constants/index.js

@@ -1,10 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.GRID_PREVENT_SELECTION_ELEMENT = exports.GRID_COL_INDEX_ATTRIBUTE = exports.GRID_ROW_INDEX_ATTRIBUTE = void 0;
-var kendo_react_data_tools_1 = require("@progress/kendo-react-data-tools");
-/** The attribute required by the Grid selection on Grid `tr` elements. */
-exports.GRID_ROW_INDEX_ATTRIBUTE = kendo_react_data_tools_1.TABLE_ROW_INDEX_ATTRIBUTE;
-/** The attribute required by the Grid selection on Grid `td` elements. */
-exports.GRID_COL_INDEX_ATTRIBUTE = kendo_react_data_tools_1.TABLE_COL_INDEX_ATTRIBUTE;
-/** Attribute which disable selection start from this element. */
-exports.GRID_PREVENT_SELECTION_ELEMENT = kendo_react_data_tools_1.TABLE_PREVENT_SELECTION_ELEMENT;

package/dist/npm/drag/ColumnDraggable.js

@@ -1,65 +0,0 @@
-"use strict";
-var __extends = (this && this.__extends) || (function () {
-    var extendStatics = function (d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
-        return extendStatics(d, b);
-    };
-    return function (d, b) {
-        if (typeof b !== "function" && b !== null)
-            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-    };
-})();
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ColumnDraggable = void 0;
-var React = require("react");
-var kendo_react_common_1 = require("@progress/kendo-react-common");
-/**
- * @hidden
- */
-var ColumnDraggable = /** @class */ (function (_super) {
-    __extends(ColumnDraggable, _super);
-    function ColumnDraggable() {
-        var _this = _super !== null && _super.apply(this, arguments) || this;
-        _this.draggable = null;
-        /**
-         * @hidden
-         */
-        _this.onPress = function (data) {
-            var element = _this.draggable && _this.draggable.element;
-            if (element && _this.props.pressHandler) {
-                _this.props.pressHandler(data.event, element);
-            }
-        };
-        /**
-         * @hidden
-         */
-        _this.onDrag = function (data) {
-            var element = _this.draggable && _this.draggable.element;
-            if (element && _this.props.dragHandler) {
-                _this.props.dragHandler(data.event, element);
-            }
-        };
-        /**
-         * @hidden
-         */
-        _this.onRelease = function (data) {
-            var element = _this.draggable && _this.draggable.element;
-            if (element && _this.props.releaseHandler) {
-                _this.props.releaseHandler(data.event);
-            }
-        };
-        return _this;
-    }
-    ColumnDraggable.prototype.render = function () {
-        var _this = this;
-        return (React.createElement(kendo_react_common_1.Draggable, { onPress: this.onPress, onDrag: this.onDrag, onRelease: this.onRelease, hint: this.props.dragClue, autoScroll: { boundaryElementRef: this.props.headerRef, direction: { horizontal: true, vertical: false } }, scrollContainer: this.props.containerRef || undefined, ref: function (component) { _this.draggable = component; } },
-            React.createElement("tr", { className: 'k-table-row', style: { touchAction: 'none' }, role: "row", "aria-rowindex": this.props.ariaRowIndex }, this.props.children)));
-    };
-    return ColumnDraggable;
-}(React.PureComponent));
-exports.ColumnDraggable = ColumnDraggable;

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

@@ -1,33 +0,0 @@
-import { ExtendedColumnProps } from '../GridColumn';
-/**
- * @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, targetId?: string) => void;
-    private isRtl;
-    constructor(triggerResize: (index: number, newWidth: number, oldWidth: number, originalEvent: any, end: boolean, targetId?: string) => void);
-    setIsRtl: (isRtl: boolean) => void;
-    dragHandler: (event: any, column: ExtendedColumnProps, dragCue: HTMLSpanElement, end: boolean) => void;
-    dblClickHandler: (event: React.MouseEvent<HTMLSpanElement, MouseEvent> | null, columnIds: string[]) => void;
-    private fixateInitialWidths;
-    private setWidths;
-    private updateColElements;
-    private updateNextLockedCol;
-}

package/dist/npm/drag/ColumnResize.js

@@ -1,237 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ColumnResize = void 0;
-// offsetWidth() is slowly transition to reporting double instead of integet in all browsers
-// during this process (which is a bit back-and-forth) we need to make sure we are working across all browsers and versions
-var OFFSET_ROUND = 1;
-var LOCK_COLUMN_BUFFER = 20;
-/**
- * @hidden
- */
-var ColumnResize = /** @class */ (function () {
-    function ColumnResize(triggerResize) {
-        var _this = this;
-        // Typings. `col` and `colgroup` do not differ, both represent a `HTMLTableColElement`.
-        // Implemented as `any`.
-        this.columns = [];
-        /**
-         * The settings for resizing the Grid.
-         */
-        this.resizable = false;
-        this.isRtl = false;
-        this.setIsRtl = function (isRtl) {
-            _this.isRtl = isRtl;
-        };
-        this.dragHandler = function (event, column, dragCue, end) {
-            var e = event.originalEvent;
-            if (!end) {
-                e.preventDefault();
-                e.stopPropagation();
-                e.stopImmediatePropagation();
-            }
-            var thElement = dragCue.closest('th');
-            if (!thElement || !thElement) {
-                return;
-            }
-            var oldWidth = thElement.clientWidth;
-            var newWidth = oldWidth;
-            if (_this.isRtl) {
-                newWidth += (dragCue.getBoundingClientRect().right - (dragCue.offsetWidth / 2)) - event.clientX;
-            }
-            else {
-                newWidth += event.clientX - dragCue.getBoundingClientRect().left - (dragCue.offsetWidth / 2);
-            }
-            if (!end && Math.abs(newWidth - oldWidth) < 1) {
-                return;
-            }
-            _this.fixateInitialWidths(thElement.parentElement.clientWidth);
-            _this.setWidths(column, Math.floor(newWidth) / oldWidth);
-            var index = _this.columns.filter(function (c) { return !c.children.length; }).findIndex(function (c) { return c.id === column.id; });
-            _this.onResize(index, oldWidth, newWidth, e, end, column.id);
-        };
-        this.dblClickHandler = function (event, columnIds) {
-            var columns = _this.columns.filter(function (c) { return columnIds.indexOf(c.id) > -1; });
-            if (!_this.colGroupMain || !columns.length) {
-                return;
-            }
-            var leafsForAdjust = {};
-            var stack = columns;
-            while (stack.length > 0) {
-                var currentCol = stack.pop();
-                if (!currentCol) {
-                    break;
-                }
-                if (currentCol.children.length) {
-                    stack.push.apply(stack, currentCol.children);
-                }
-                else {
-                    leafsForAdjust[currentCol.id] = currentCol;
-                }
-            }
-            var leafs = _this.columns.filter(function (c) { return !c.children.length; });
-            var indexesForAdjust = [];
-            leafs.forEach(function (currentColumn, index) {
-                if (leafsForAdjust[currentColumn.id]) {
-                    indexesForAdjust.push(index);
-                }
-            });
-            var tables = [_this.colGroupMain.parentElement];
-            var colgroups = [_this.colGroupMain];
-            if (_this.colGroupHeader) {
-                tables.push(_this.colGroupHeader.parentElement);
-                colgroups.push(_this.colGroupHeader);
-            }
-            if (_this.colGroupFooter) {
-                tables.push(_this.colGroupFooter.parentElement);
-                colgroups.push(_this.colGroupFooter);
-            }
-            tables.forEach(function (table) { return table.classList.add('k-autofitting'); });
-            var maxWidths = [];
-            colgroups.forEach(function (colgroup) {
-                indexesForAdjust.forEach(function (columnIndex) {
-                    if (colgroup.children[columnIndex]) {
-                        colgroup.children[columnIndex].width = '';
-                        maxWidths[columnIndex] = Math.max(maxWidths[columnIndex] || 0, colgroup.children[columnIndex].offsetWidth + OFFSET_ROUND);
-                    }
-                });
-            });
-            colgroups.forEach(function (colgroup) {
-                indexesForAdjust.forEach(function (columnIndex) {
-                    if (colgroup.children[columnIndex]) {
-                        colgroup.children[columnIndex].width = maxWidths[columnIndex] + 'px';
-                        leafs[columnIndex].width = maxWidths[columnIndex];
-                    }
-                });
-            });
-            tables.forEach(function (table) { return table.classList.remove('k-autofitting'); });
-            _this.onResize(indexesForAdjust[0], 0, 0, event, true, columnIds[0]);
-        };
-        this.updateColElements = function (affectedColumns) {
-            var leafColumns = _this.columns.filter(function (c) { return !c.children.length; });
-            var difference = 1e-10;
-            var _loop_1 = function (i) {
-                var currentColumn = affectedColumns[i];
-                var colIndex = leafColumns.findIndex(function (c) { return c.id === currentColumn.id; });
-                var currentColumnFloatWidth = parseFloat((currentColumn.width || 0).toString());
-                var currentColumnFloorWidth = Math.floor(currentColumnFloatWidth);
-                difference += currentColumnFloatWidth - currentColumnFloorWidth;
-                var currentWidth = currentColumnFloorWidth + Math.floor(difference);
-                difference -= Math.floor(difference);
-                if (_this.colGroupMain && _this.colGroupMain.children[colIndex]) {
-                    var mainWidth = parseInt(_this.colGroupMain.children[colIndex].width, 10);
-                    _this.colGroupMain.children[colIndex].width = currentWidth + 'px';
-                    _this.updateNextLockedCol(_this.colGroupMain.parentElement, currentColumn, mainWidth - currentWidth);
-                }
-                if (_this.colGroupHeader && _this.colGroupHeader.children[colIndex]) {
-                    var headerWidth = parseInt(_this.colGroupHeader.children[colIndex].width, 10);
-                    // static headers
-                    _this.colGroupHeader.children[colIndex].width = currentWidth + 'px';
-                    _this.updateNextLockedCol(_this.colGroupHeader.parentElement, currentColumn, headerWidth - currentWidth);
-                }
-                if (_this.colGroupFooter && _this.colGroupFooter.children[colIndex]) {
-                    var footerWidth = parseInt(_this.colGroupFooter.children[colIndex].width, 10);
-                    // static footers
-                    _this.colGroupFooter.children[colIndex].width = currentWidth + 'px';
-                    _this.updateNextLockedCol(_this.colGroupFooter.parentElement, currentColumn, footerWidth - currentWidth);
-                }
-            };
-            for (var i = 0; i < affectedColumns.length; i++) {
-                _loop_1(i);
-            }
-        };
-        this.onResize = triggerResize;
-    }
-    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.findIndex(function (c) { return c.id === column.id; });
-        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);
-        return toAdjust;
-    };
-    ColumnResize.prototype.updateNextLockedCol = function (element, current, deltaWidth) {
-        var _this = this;
-        var currentIndex = current.index;
-        var gridWrapperEl = this.colGroupMain.parentElement.closest('.k-grid');
-        var maxWidth = gridWrapperEl === null || gridWrapperEl === void 0 ? void 0 : gridWrapperEl.clientWidth;
-        var widthOfLocked = this.columns.filter(function (c) { return c.locked; }).map(function (e) { return parseInt(e.width + '', 10); }).reduce(function (a, b) { return a + b; }, 0);
-        if (!current.locked || maxWidth <= widthOfLocked + LOCK_COLUMN_BUFFER) {
-            return;
-        }
-        this.columns.forEach(function (nColumn) {
-            if ((nColumn === null || nColumn === void 0 ? void 0 : nColumn.locked) && deltaWidth) {
-                var allColumnEls = element === null || element === void 0 ? void 0 : element.querySelectorAll('[aria-colindex="' + nColumn.ariaColumnIndex + '"]');
-                allColumnEls === null || allColumnEls === void 0 ? void 0 : allColumnEls.forEach(function (el) {
-                    var currentStyle = el.style;
-                    if (_this.isRtl) {
-                        if (nColumn.index > currentIndex && currentStyle && currentStyle.right) {
-                            currentStyle.right = parseInt(currentStyle.right, 10) - deltaWidth + 'px';
-                        }
-                        if (nColumn.index < currentIndex && currentStyle && currentStyle.left) {
-                            currentStyle.left = parseInt(currentStyle.left, 10) - deltaWidth + 'px';
-                        }
-                    }
-                    else {
-                        if (nColumn.index > currentIndex && currentStyle && currentStyle.left) {
-                            currentStyle.left = parseInt(currentStyle.left, 10) - deltaWidth + 'px';
-                        }
-                        if (nColumn.index < currentIndex && currentStyle && currentStyle.right) {
-                            currentStyle.right = parseInt(currentStyle.right, 10) - deltaWidth + 'px';
-                        }
-                    }
-                });
-            }
-        });
-    };
-    return ColumnResize;
-}());
-exports.ColumnResize = ColumnResize;

package/dist/npm/drag/CommonDragLogic.d.ts

@@ -1,40 +0,0 @@
-import * as React from 'react';
-import { DragClue, DropClue } from '@progress/kendo-react-data-tools';
-import { ExtendedColumnProps } from '../GridColumn';
-/**
- * @hidden
- */
-export declare type handler = (prevIndex: number, nextIndex: number, nativeEvent: any) => void;
-/**
- * @hidden
- */
-export declare class CommonDragLogic {
-    refDragElementClue: React.RefObject<DragClue>;
-    refDropElementClue: React.RefObject<DropClue>;
-    columns: ExtendedColumnProps[];
-    reorderable: boolean;
-    groupable: boolean;
-    private startColumn;
-    private startGroup;
-    private currentColumn;
-    private currentGroup;
-    private columnReorder;
-    private groupReorder;
-    private columnToGroup;
-    private groupPanelDivElement;
-    get dragClueRef(): React.RefObject<DragClue | null>;
-    get dropClueRef(): React.RefObject<DropClue | null>;
-    private get dragElementClue();
-    private get dropElementClue();
-    constructor(columnReorder: handler, groupReorder: handler, columnToGroup: handler);
-    refGroupPanelDiv: (e: any) => void;
-    pressHandler: (event: any, element: HTMLTableRowElement | HTMLDivElement) => void;
-    dragHandler: (event: any, element: HTMLTableRowElement | HTMLDivElement) => void;
-    releaseHandler: (event: any) => void;
-    private getColumnIndex;
-    private isTargetGroupingContainer;
-    private getGroupIndex;
-    private isValid;
-    private updateDragElementClue;
-    private updateDropElementClue;
-}