@progress/kendo-react-pivotgrid 5.6.0-dev.202208291418 → 5.6.0-dev.202209021051

package/dist/npm/messages/index.js

@@ -1,7 +1,11 @@
 "use strict";
 var _a;
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.messages = exports.configuratorButtonLabel = exports.configuratorMissingFields = exports.configuratorEditorSearchPlaceholder = exports.configuratorEditorSearchTitle = exports.configuratorMeasuresTitle = exports.configuratorRowsTitle = exports.configuratorColumnsTitle = exports.configuratorApply = exports.configuratorCancel = exports.configuratorTitle = exports.fieldMenuApply = exports.fieldMenuReset = void 0;
+exports.messages = exports.configuratorButtonLabel = exports.configuratorMissingFields = exports.configuratorEditorSearchPlaceholder = exports.configuratorEditorSearchTitle = exports.configuratorMeasuresTitle = exports.configuratorRowsTitle = exports.configuratorColumnsTitle = exports.configuratorApply = exports.configuratorCancel = exports.configuratorTitle = exports.fieldMenuApply = exports.fieldMenuReset = exports.emptyCellAriaLabel = void 0;
+/**
+ * @hidden
+ */
+exports.emptyCellAriaLabel = 'pivotgrid.emptyCellAriaLabel';
 /**
  * @hidden
  */
@@ -54,6 +58,7 @@ exports.configuratorButtonLabel = 'pivotgrid.configuratorButtonLabel';
  * @hidden
  */
 exports.messages = (_a = {},
+    _a[exports.emptyCellAriaLabel] = 'PivotGrid component. Use the arrow keys to navigate.',
     _a[exports.fieldMenuReset] = 'Reset',
     _a[exports.fieldMenuApply] = 'Apply',
     _a[exports.configuratorCancel] = 'Cancel',

package/dist/npm/package-metadata.js

@@ -8,7 +8,7 @@ exports.packageMetadata = {
     name: '@progress/kendo-react-pivotgrid',
     productName: 'KendoReact',
     productCodes: ['KENDOUIREACT', 'KENDOUICOMPLETE'],
-    publishDate: 1661782221,
+    publishDate: 1662115406,
     version: '',
     licensingDocsUrl: 'https://www.telerik.com/kendo-react-ui/my-license/?utm_medium=product&utm_source=kendoreact&utm_campaign=kendo-ui-react-purchase-license-keys-warning'
 };

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

@@ -1,5 +1,16 @@
-import { AxisDescriptor } from '@progress/kendo-pivotgrid-common';
-import { PivotGridField } from '@progress/kendo-pivotgrid-common';
+import { AxisDescriptor, PivotDataItem, PivotGridField, Tuple } from '@progress/kendo-pivotgrid-common';
+/**
+ * Generates suitable data for Charting visualization.
+ *
+ * @param rows - The PivotGrid's rows prop.
+ * @param columns - The PivotGrid's columns prop.
+ * @param data - The PivotGrid's data prop.
+ * @returns - Suitable data for Charting visualization.
+ */
+export declare const dataCells: (rows?: Tuple[], columns?: Tuple[], data?: PivotDataItem[]) => {
+    row: string[];
+    cells: PivotDataItem[];
+}[];
 /**
  * @hidden
  */

package/dist/npm/utils/index.js

@@ -9,7 +9,27 @@ var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
     return to.concat(ar || Array.prototype.slice.call(from));
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.compareFields = exports.findFilters = exports.findFilter = exports.generateDataKey = exports.generateKey = exports.extractDefaultFields = exports.flatMap = exports.recursiveMap = void 0;
+exports.compareFields = exports.findFilters = exports.findFilter = exports.generateDataKey = exports.generateKey = exports.extractDefaultFields = exports.flatMap = exports.recursiveMap = exports.dataCells = void 0;
+var kendo_pivotgrid_common_1 = require("@progress/kendo-pivotgrid-common");
+/**
+ * Generates suitable data for Charting visualization.
+ *
+ * @param rows - The PivotGrid's rows prop.
+ * @param columns - The PivotGrid's columns prop.
+ * @param data - The PivotGrid's data prop.
+ * @returns - Suitable data for Charting visualization.
+ */
+var dataCells = function (rows, columns, data) {
+    var pRows = JSON.parse(JSON.stringify(rows || []));
+    var pColumns = JSON.parse(JSON.stringify(columns || []));
+    var pData = JSON.parse(JSON.stringify(data || []));
+    var rowsTree = (0, kendo_pivotgrid_common_1.toTree)(pRows);
+    var _a = (0, kendo_pivotgrid_common_1.toRows)(rowsTree), rowHeaderLeafs = _a[1], rowHeaderDepth = _a[2];
+    var columnsTree = (0, kendo_pivotgrid_common_1.toTree)(pColumns);
+    var _b = (0, kendo_pivotgrid_common_1.toColumns)(columnsTree), columnHeaderLeafs = _b[1], columnHeaderBreadth = _b[3];
+    return (0, kendo_pivotgrid_common_1.toData)(pData, columnHeaderLeafs, rowHeaderLeafs, columnHeaderBreadth, rowHeaderDepth);
+};
+exports.dataCells = dataCells;
 /**
  * @hidden
  */

package/dist/npm/utils/navigation.d.ts

@@ -0,0 +1,22 @@
+/**
+ * @hidden
+ */
+declare class PivotGridNavigation {
+    root: HTMLElement | null;
+    get elements(): HTMLElement[];
+    get first(): HTMLElement | null;
+    get last(): HTMLElement | null;
+    selectors: string[];
+    tabIndex: number;
+    private eventHandlers;
+    private mouseEvents;
+    private keyboardEvents;
+    constructor(settings: {
+        tabIndex: number;
+    });
+    start(root: HTMLElement): void;
+    stop(): void;
+    focusElement(element: HTMLElement | null, previous: HTMLElement | null): void;
+    update: () => void;
+}
+export { PivotGridNavigation };

package/dist/npm/utils/navigation.js

@@ -0,0 +1,268 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PivotGridNavigation = void 0;
+var scrollableValuesSel = '.k-pivotgrid .k-pivotgrid-values';
+var scrollableColumnHeaderSel = '.k-pivotgrid .k-pivotgrid-column-headers';
+var scrollableRowHeaderSel = '.k-pivotgrid .k-pivotgrid-row-headers';
+var emptyCellSel = '.k-pivotgrid > .k-pivotgrid-empty-cell';
+var tableSel = 'table.k-pivotgrid-table';
+var cellSel = '.k-pivotgrid-cell';
+var scrollables = [scrollableValuesSel, scrollableColumnHeaderSel, scrollableRowHeaderSel].join(',');
+var selectors = [
+    emptyCellSel,
+    [scrollableColumnHeaderSel, tableSel, cellSel].join(' '),
+    [scrollableRowHeaderSel, tableSel, cellSel].join(' '),
+    [scrollableValuesSel, tableSel, cellSel].join(' ')
+];
+var onEnter = function (target, nav, ev) {
+    var icon = target.querySelector('.k-icon');
+    if (icon) {
+        var index_1 = nav.elements.indexOf(target);
+        nav.update = function () {
+            nav.focusElement(nav.elements[index_1], null);
+            nav.update = function () { };
+        };
+        icon.click();
+        ev.preventDefault();
+    }
+};
+var tryScrollLeft = function (target, scrollable, elToScroll) {
+    if (target.offsetLeft < scrollable.scrollLeft) {
+        elToScroll.scrollLeft = target.offsetLeft;
+    }
+};
+var tryScrollRight = function (target, scrollable, elToScroll) {
+    if (target.offsetLeft + target.offsetWidth > scrollable.scrollLeft + scrollable.offsetWidth &&
+        target.offsetWidth < scrollable.offsetWidth) {
+        elToScroll.scrollLeft = target.offsetLeft + target.offsetWidth - scrollable.offsetWidth;
+    }
+};
+var tryScrollUp = function (target, scrollable, elToScroll) {
+    if (scrollable.scrollTop && target.offsetTop < scrollable.scrollTop) {
+        elToScroll.scrollTop = target.offsetTop;
+    }
+};
+var tryScrollDown = function (target, scrollable, elToScroll) {
+    if (target.offsetTop + target.offsetHeight > scrollable.scrollTop + scrollable.offsetHeight &&
+        target.offsetHeight < scrollable.offsetHeight) {
+        elToScroll.scrollTop = target.offsetTop + target.offsetHeight - scrollable.offsetHeight;
+    }
+};
+var scrollTo = function (target, root, scrollFunc) {
+    var elToScroll = root.querySelector(scrollableValuesSel);
+    var scrollable = target && target.closest(scrollables);
+    if (!elToScroll || !scrollable || !target) {
+        return;
+    }
+    scrollFunc.forEach(function (scroll) { return scroll(target, scrollable, elToScroll); });
+};
+var tableMap = function (table) {
+    var rows = Array.from(table.rows);
+    var colsCount = Array.from((rows && rows[0] && rows[0].cells) || [])
+        .map(function (c) { return c.colSpan; })
+        .reduce(function (prev, cur) { return prev + cur; }, 0);
+    var map = rows.map(function () { return new Array(colsCount); });
+    rows.forEach(function (row, r) {
+        var curColSpan = 0;
+        Array.from(row.cells).forEach(function (c) {
+            for (var colSp = 0; colSp < c.colSpan; colSp++) {
+                for (var rowSp = 0; rowSp < c.rowSpan; rowSp++) {
+                    var ind = map[r + rowSp].findIndex(function (val, curInd) { return curInd >= curColSpan && !val; });
+                    map[r + rowSp][ind] = c;
+                }
+                curColSpan++;
+            }
+        });
+    });
+    return map;
+};
+var navigationMap = function (root) {
+    var columnHeader = tableMap(root.querySelector([scrollableColumnHeaderSel, tableSel].join(' ')));
+    var rowHeader = tableMap(root.querySelector([scrollableRowHeaderSel, tableSel].join(' ')));
+    var values = tableMap(root.querySelector([scrollableValuesSel, tableSel].join(' ')));
+    var emptyCell = root.querySelector(emptyCellSel);
+    var emptyCellRow = new Array(rowHeader[0].length).fill(emptyCell);
+    var map = [];
+    for (var i = 0; i < columnHeader.length; i++) {
+        map.push(emptyCellRow.concat(columnHeader[i]));
+    }
+    for (var i = 0; i < rowHeader.length; i++) {
+        map.push(rowHeader[i].concat(values[i]));
+    }
+    return map;
+};
+var getTargetPos = function (map, target) {
+    for (var r = 0; r < map.length; r++) {
+        for (var c = 0; c < map[r].length; c++) {
+            if (map[r][c] === target) {
+                return [r, c];
+            }
+        }
+    }
+    return [-1, -1];
+};
+var cellAt = function (root, target, pos) {
+    var map = navigationMap(root);
+    var targetPos = getTargetPos(map, target);
+    var nextPos = [targetPos[0] + pos[0], targetPos[1] + pos[1]];
+    var next = map[nextPos[0]] && map[nextPos[0]][nextPos[1]];
+    while (next && next === target) {
+        nextPos = [nextPos[0] + pos[0], nextPos[1] + pos[1]];
+        next = map[nextPos[0]] && map[nextPos[0]][nextPos[1]];
+    }
+    return next;
+};
+var keyboardEvents = {
+    keydown: {
+        ArrowLeft: function (target, nav, ev) {
+            ev.preventDefault();
+            var next = cellAt(nav.root, target, [0, -1]);
+            nav.focusElement(next, target);
+            scrollTo(next, nav.root, [tryScrollRight, tryScrollLeft, tryScrollDown, tryScrollUp]);
+        },
+        ArrowRight: function (target, nav, ev) {
+            ev.preventDefault();
+            var next = cellAt(nav.root, target, [0, 1]);
+            nav.focusElement(next, target);
+            scrollTo(next, nav.root, [tryScrollLeft, tryScrollRight, tryScrollDown, tryScrollUp]);
+        },
+        ArrowUp: function (target, nav, ev) {
+            ev.preventDefault();
+            var next = cellAt(nav.root, target, [-1, 0]);
+            nav.focusElement(next, target);
+            scrollTo(next, nav.root, [tryScrollRight, tryScrollLeft, tryScrollDown, tryScrollUp]);
+        },
+        ArrowDown: function (target, nav, ev) {
+            ev.preventDefault();
+            var next = cellAt(nav.root, target, [1, 0]);
+            nav.focusElement(next, target);
+            scrollTo(next, nav.root, [tryScrollRight, tryScrollLeft, tryScrollUp, tryScrollDown]);
+        },
+        Enter: onEnter,
+        Space: onEnter,
+        Home: function (target, nav, ev) {
+            var map = navigationMap(nav.root);
+            var row = ev.ctrlKey ? map[0] : (map.find(function (ro) { return Boolean(ro.find(function (x) { return x === target; })); }) || []);
+            var next = row[0];
+            if (next) {
+                nav.focusElement(next, target);
+                scrollTo(next, nav.root, [tryScrollRight, tryScrollLeft, tryScrollDown, tryScrollUp]);
+                ev.preventDefault();
+            }
+        },
+        End: function (target, nav, ev) {
+            var map = navigationMap(nav.root);
+            var row = ev.ctrlKey ? map[map.length - 1] : (map.find(function (ro) { return Boolean(ro.find(function (x) { return x === target; })); }) || []);
+            var next = row && row[row.length - 1] || null;
+            if (next) {
+                nav.focusElement(next, target);
+                scrollTo(next, nav.root, [tryScrollLeft, tryScrollRight, tryScrollUp, tryScrollDown]);
+                ev.preventDefault();
+            }
+        }
+    }
+};
+var mouseEvents = {
+    click: function (target, nav) {
+        if (target && target instanceof HTMLElement) {
+            var prev = nav.elements.find(function (c) { return c.hasAttribute('tabindex'); }) || null;
+            nav.focusElement(target, prev);
+        }
+    }
+};
+/**
+ * @hidden
+ */
+var PivotGridNavigation = /** @class */ (function () {
+    function PivotGridNavigation(settings) {
+        this.root = null;
+        this.selectors = [];
+        this.tabIndex = 0;
+        this.eventHandlers = {};
+        this.mouseEvents = {};
+        this.keyboardEvents = {};
+        this.update = function () { };
+        this.selectors = selectors;
+        this.mouseEvents = mouseEvents;
+        this.keyboardEvents = keyboardEvents;
+        this.tabIndex = settings.tabIndex;
+    }
+    Object.defineProperty(PivotGridNavigation.prototype, "elements", {
+        get: function () {
+            return this.root ? Array.from(this.root.querySelectorAll(this.selectors.join(','))) : [];
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(PivotGridNavigation.prototype, "first", {
+        get: function () {
+            return (this.root && this.root.querySelector(this.selectors.join(','))) || null;
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(PivotGridNavigation.prototype, "last", {
+        get: function () {
+            var all = this.elements;
+            return all[all.length - 1] || null;
+        },
+        enumerable: false,
+        configurable: true
+    });
+    PivotGridNavigation.prototype.start = function (root) {
+        var _this = this;
+        this.root = root;
+        var _loop_1 = function (eventType) {
+            if (this_1.mouseEvents[eventType]) {
+                this_1.eventHandlers[eventType] = (function (ev) {
+                    var target = ev.target instanceof Element && ev.target.closest(_this.selectors.join(','));
+                    if (target) {
+                        _this.mouseEvents[eventType].call(undefined, target, _this, ev);
+                    }
+                });
+                root.addEventListener(eventType, this_1.eventHandlers[eventType]);
+            }
+        };
+        var this_1 = this;
+        for (var eventType in this.mouseEvents) {
+            _loop_1(eventType);
+        }
+        var _loop_2 = function (eventType) {
+            if (this_2.keyboardEvents[eventType]) {
+                this_2.eventHandlers[eventType] = (function (ev) {
+                    var target = ev.target instanceof Element && ev.target.closest(_this.selectors.join(','));
+                    var key = ev.key === ' ' ? 'Space' : ev.key;
+                    if (target && _this.keyboardEvents[eventType][key]) {
+                        _this.keyboardEvents[eventType][key].call(undefined, target, _this, ev);
+                    }
+                });
+                root.addEventListener(eventType, this_2.eventHandlers[eventType]);
+            }
+        };
+        var this_2 = this;
+        for (var eventType in this.keyboardEvents) {
+            _loop_2(eventType);
+        }
+    };
+    PivotGridNavigation.prototype.stop = function () {
+        if (this.root) {
+            for (var eventType in this.eventHandlers) {
+                if (this.eventHandlers[eventType]) {
+                    this.root.removeEventListener(eventType, this.eventHandlers[eventType]);
+                }
+            }
+        }
+        this.root = null;
+    };
+    PivotGridNavigation.prototype.focusElement = function (element, previous) {
+        if (element) {
+            if (previous) {
+                previous.removeAttribute('tabindex');
+            }
+            element.setAttribute('tabindex', String(this.tabIndex));
+            element.focus({ preventScroll: true });
+        }
+    };
+    return PivotGridNavigation;
+}());
+exports.PivotGridNavigation = PivotGridNavigation;