@progress/kendo-react-data-tools 13.3.0-develop.9 → 13.4.0-develop.1

package/pager/models/index.d.ts

@@ -0,0 +1,178 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+/**
+ * A Pager target event.
+ */
+export interface PagerTargetEvent {
+    [key: string]: any;
+    /**
+     * An event target.
+     */
+    target?: any;
+    /**
+     * An event value.
+     */
+    value?: any;
+}
+export interface PagerHandle {
+    /**
+     * Represents the element of the Pager component.
+     */
+    element: HTMLDivElement | null;
+    /**
+     * Represents the props of the Pager component.
+     */
+    props: Readonly<PagerProps>;
+}
+/**
+ * Represents the object of the `onPageChange` event.
+ */
+export interface PageChangeEvent extends BasePageChangeEvent {
+    /**
+     * An event target.
+     */
+    target: PagerHandle;
+    /**
+     * A React Synthetic Event.
+     */
+    syntheticEvent: React.SyntheticEvent<any>;
+    /**
+     * A native DOM event.
+     */
+    nativeEvent: any;
+    /**
+     * A target change event.
+     */
+    targetEvent: PagerTargetEvent;
+}
+/**
+ * Represents the base object of the `onPageChange` event. It is usually used
+ * in custom pager scenarios in cases when we don't need any of the events or the target.
+ */
+export interface BasePageChangeEvent {
+    /**
+     * The number of records that will be skipped.
+     */
+    skip: number;
+    /**
+     * The number of records that will be taken.
+     */
+    take: number;
+    /**
+     * A React Synthetic Event.
+     */
+    syntheticEvent?: React.SyntheticEvent<any>;
+    /**
+     * A native DOM event.
+     */
+    nativeEvent?: any;
+    /**
+     * A target change event.
+     */
+    targetEvent?: PagerTargetEvent;
+}
+export interface PagerProps {
+    /**
+     * The total number of records.
+     */
+    total: number;
+    /**
+     * The number of records that will be skipped.
+     */
+    skip: number;
+    /**
+     * The number of records that will be taken.
+     */
+    take: number;
+    /**
+     * Sets additional classes to the Pager.
+     */
+    className?: string;
+    /**
+     * The styles that are applied to the Pager.
+     */
+    style?: React.CSSProperties;
+    /**
+     * Sets the maximum numeric buttons count before the buttons are collapsed.
+     */
+    buttonCount?: number;
+    /**
+     * Toggles the information about the current page and the total number of records.
+     */
+    info?: boolean;
+    /**
+     * Defines the type of the pager.
+     * * (Default) `numeric` — Renders buttons with numbers.
+     * * `input` — Renders an input field for typing the page number.
+     */
+    type?: 'numeric' | 'input';
+    /**
+     * Displays a menu for selecting the page size.
+     */
+    pageSizes?: Array<number> | Array<number | string>;
+    /**
+     * Sets the selected value of the page size Dropdownlist.
+     * It is useful when the selected value could also be a string not only a number.
+     */
+    pageSizeValue?: string | number;
+    /**
+     * Toggles the **Previous** and **Next** buttons.
+     */
+    previousNext?: boolean;
+    /**
+     * Defines if the pager will be responsive.
+     * If true, hides the tools that do not fit to the available space.
+     *
+     * @default `true`
+     */
+    responsive?: boolean;
+    /**
+     * Configures the `size` of the Pager.
+     *
+     * The available options are:
+     * - small
+     * - medium
+     * - large
+     * - null&mdash;Does not set a size `className`.
+     *
+     * @default `medium`
+     */
+    size?: 'small' | 'medium' | 'large';
+    /**
+     * Fires when the page of the Pager is changed. You have to handle the event yourself and page the data.
+     */
+    onPageChange?: ((event: PageChangeEvent) => void) | ((event: BasePageChangeEvent) => void);
+    /**
+     * Useful for modifying the Pager messages.
+     */
+    messagesMap?: (messageKey: string) => {
+        messageKey: string;
+        defaultMessage: string;
+    };
+    /**
+     * Sets the direction of the component.
+     */
+    dir?: string;
+    /**
+     * If set to `true`, the user can use dedicated shortcuts to interact with the Pager.
+     * By default, navigation is disabled and the Pager content is accessible in the normal tab sequence.
+     */
+    navigatable?: boolean;
+    /**
+     * Controls the disabled state of the Pager. Defaults to `false`.
+     */
+    disabled?: boolean;
+    /**
+     * Providing different rendering of the page sizes select element based on the screen dimensions.
+     */
+    adaptive?: boolean;
+    /**
+     * Specifies the text that is rendered as title in the adaptive page sizes select element.
+     */
+    adaptiveTitle?: string;
+}

package/pager/utils.d.ts

@@ -0,0 +1,66 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+import { LocalizationService } from '@progress/kendo-react-intl';
+/**
+ * @hidden
+ */
+export type L10NMessages = {
+    messageKey: string;
+    defaultMessage: string;
+};
+/**
+ * @hidden
+ */
+export type L10NMessageMap = (messageKey: string) => {
+    messageKey: string;
+    defaultMessage: string;
+};
+/**
+ * @hidden
+ */
+export declare const getL10NMessage: (key: string, messagesMap?: L10NMessageMap) => L10NMessages;
+/**
+ * @hidden
+ */
+export declare const translateMessage: (localization: LocalizationService, messageMap: L10NMessages) => string;
+/**
+ * @hidden
+ */
+export declare const getFirstButtonProps: (isRtl: boolean, currentPage: number, disabled: boolean) => {
+    rtlClass: string;
+    rtlIcon: import('@progress/kendo-svg-icons').SVGIcon;
+    isDisabledClass: string;
+    isDisabled: boolean | undefined;
+};
+/**
+ * @hidden
+ */
+export declare const getPrevButtonProps: (isRtl: boolean, currentPage: number, disabled: boolean) => {
+    rtlClass: string;
+    rtlIcon: import('@progress/kendo-svg-icons').SVGIcon;
+    isDisabledClass: string;
+    isDisabled: boolean | undefined;
+};
+/**
+ * @hidden
+ */
+export declare const getNextButtonProps: (isRtl: boolean, currentPage: number, totalPages: number, disabled: boolean) => {
+    rtlClass: string;
+    rtlIcon: import('@progress/kendo-svg-icons').SVGIcon;
+    isDisabledClass: string;
+    isDisabled: boolean | undefined;
+};
+/**
+ * @hidden
+ */
+export declare const getLastButtonProps: (isRtl: boolean, currentPage: number, totalPages: number, disabled: boolean) => {
+    rtlClass: string;
+    rtlIcon: import('@progress/kendo-svg-icons').SVGIcon;
+    isDisabledClass: string;
+    isDisabled: boolean | undefined;
+};

package/selection/TableSelectableSettings.d.ts

@@ -0,0 +1,38 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+/** @hidden */
+export type TableSelectableMode = 'single' | 'multiple';
+/** @hidden */
+export interface TableSelectableSettings {
+    /**
+     * Determines if selection is allowed.
+     *
+     * @default true
+     */
+    enabled?: boolean;
+    /**
+     * The available values are:
+     * * `single`
+     * * `multiple`
+     *
+     * @default "multiple"
+     */
+    mode?: TableSelectableMode;
+    /**
+     * Determines if cell selection is allowed.
+     *
+     * @default false
+     */
+    cell?: boolean;
+    /**
+     * Determines if drag selection is allowed.
+     *
+     * @default false
+     */
+    drag?: boolean;
+}

package/selection/TableSelection.d.ts

@@ -0,0 +1,25 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+import { TableSelectableSettings } from './TableSelectableSettings.js';
+import { TableDragSelectionReleaseEvent } from './events.js';
+import * as React from 'react';
+/**
+ * The descriptor used to define the selected state of a data-item.
+ */
+export type SelectDescriptor = {
+    [id: string]: boolean | number[];
+};
+/** @hidden */
+export interface TableSelectionProps {
+    children: any;
+    selectable?: TableSelectableSettings;
+    onRelease: (options: TableDragSelectionReleaseEvent) => void;
+    childRef?: (childElement: HTMLElement) => void;
+}
+/** @hidden */
+export declare const TableSelection: (props: TableSelectionProps) => React.JSX.Element;

package/selection/constants.d.ts

@@ -0,0 +1,13 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+/** @hidden */
+export declare const TABLE_ROW_INDEX_ATTRIBUTE = "data-grid-row-index";
+/** @hidden */
+export declare const TABLE_COL_INDEX_ATTRIBUTE = "data-grid-col-index";
+/** @hidden */
+export declare const TABLE_PREVENT_SELECTION_ELEMENT = "data-prevent-selection";

package/selection/events.d.ts

@@ -0,0 +1,101 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+import { BaseEvent } from '@progress/kendo-react-common';
+/** @hidden */
+export interface TableKeyDownEvent<T> extends BaseEvent<T> {
+    /**
+     * The current leaf data items.
+     */
+    dataItems: any[];
+    /**
+     * Selection mode.
+     */
+    mode: 'single' | 'multiple';
+    /**
+     * Indicates if cell selection mode is enabled.
+     */
+    cell: boolean;
+    /**
+     * The `selectedField` prop of the component.
+     */
+    selectedField: string;
+    /**
+     * The component unique identifier.
+     */
+    componentId: string;
+}
+/** @hidden */
+export interface TableDragSelectionReleaseEvent {
+    /**
+     * Selection start row index.
+     */
+    startRowIndex: number;
+    /**
+     * Selection start column index.
+     */
+    startColIndex: number;
+    /**
+     * Selection end row index.
+     */
+    endRowIndex: number;
+    /**
+     * Selection end column index.
+     */
+    endColIndex: number;
+    /**
+     * A native DOM event.
+     */
+    nativeEvent: any;
+    /**
+     * Is ctrl key modifier pressed.
+     */
+    ctrlKey: boolean;
+    /**
+     * Is alt key modifier pressed.
+     */
+    altKey: boolean;
+    /**
+     * Is meta key modifier pressed.
+     */
+    metaKey: boolean;
+    /**
+     * Is shift key modifier pressed.
+     */
+    shiftKey: boolean;
+    /**
+     * Selection mode.
+     */
+    mode: 'single' | 'multiple';
+    /**
+     * Indicates if cell selection mode is enabled.
+     */
+    cell: boolean;
+    /**
+     * Indicates if current event is created from drag.
+     */
+    isDrag: boolean;
+}
+/** @hidden */
+export interface TableSelectionChangeEvent<T> extends BaseEvent<T>, TableDragSelectionReleaseEvent {
+    /**
+     * The data item which was selected or deselected when the checkbox selection column is used. It will be `null` when the row or cell selection is used.
+     */
+    dataItem: any;
+    /**
+     * The `selectedField` prop of the component.
+     */
+    selectedField: string;
+    /**
+     * The component unique identifier.
+     */
+    componentId: string;
+    /**
+     * The current component leaf data items.
+     */
+    dataItems: any[];
+}

package/selection/utils.d.ts

@@ -0,0 +1,70 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+import { TableKeyDownEvent, TableSelectionChangeEvent } from './events.js';
+import { TableSelectableSettings } from './TableSelectableSettings.js';
+/** @hidden */
+export declare const isInNonSelectable: (target: HTMLElement | null) => boolean;
+/** @hidden */
+export declare const closestTagName: (target: HTMLElement | null, tagName: 'TD' | 'TR' | 'TABLE') => HTMLElement | null;
+/** @hidden */
+export declare const getRowIndex: (element: HTMLTableRowElement) => number | undefined;
+/** @hidden */
+export declare const getColumnIndex: (element: HTMLTableCellElement) => number | undefined;
+/**
+ * @hidden
+ *
+ * Apply the selected field to the data items based on the selected state.
+ *
+ * @param {{data: any, selectedState:  {[id: string]: boolean | number[]}, dataItemKey: string; selectedField: string; subItemsField?: string; }} options
+ * @returns {any[]}
+ */
+export declare const setSelectedState: (options: {
+    data: any;
+    selectedState: {
+        [id: string]: boolean | number[];
+    };
+    dataItemKey: string;
+    selectedField: string;
+    subItemsField?: string | undefined;
+}) => any[];
+/**
+ * Get selected state from the component KeyDown event.
+ *
+ * @param {{event: TableKeyDownEvent, selectedState:  {[id: string]: boolean | number[]}, dataItemKey: string}} options
+ * @returns {{[id: string]: boolean | number[]}} - The new selected state.
+ */
+export declare const getSelectedStateFromKeyDown: (options: {
+    event: TableKeyDownEvent<any>;
+    selectedState: {
+        [id: string]: boolean | number[];
+    };
+    dataItemKey: string;
+}) => {
+    [id: string]: boolean | number[];
+};
+/**
+ * Get selected state from the component selection event.
+ *
+ * @param {{event: TableSelectionChangeEvent, selectedState:  {[id: string]: boolean | number[]}, dataItemKey: string}} options
+ * @returns {{[id: string]: boolean | number[]}} - The new selected state.
+ */
+export declare const getSelectedState: (options: {
+    event: TableSelectionChangeEvent<any>;
+    selectedState: {
+        [id: string]: boolean | number[];
+    };
+    dataItemKey: string;
+}) => {
+    [id: string]: boolean | number[];
+};
+/** @hidden */
+export declare const relativeContextElement: (element: any) => any;
+/** @hidden */
+export declare const getOffset: (offsetParent: any) => any;
+/** @hidden */
+export declare const getSelectionOptions: (selectable?: boolean | TableSelectableSettings) => Required<TableSelectableSettings>;

package/utils/DataItemWrapper.d.ts

@@ -0,0 +1,17 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+/**
+ * @hidden
+ */
+export interface DataItemWrapper {
+    dataItem: any;
+    level: number[];
+    height: number;
+    offsetTop: number;
+    levelCount: number;
+}

package/utils/SearchField.d.ts

@@ -0,0 +1,24 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+/**
+ * Represents the SearchField that configures the way a data field is searched.
+ */
+export interface SearchField {
+    /**
+     * The name of the searched field.
+     */
+    field: string;
+    /**
+     * The string operator that will be used for search.
+     */
+    operator?: string;
+    /**
+     * Defines if the search is case sensitive.
+     */
+    ignoreCase?: boolean;
+}

package/utils/data-operations.d.ts

@@ -0,0 +1,107 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+import { SortDescriptor, FilterDescriptor, CompositeFilterDescriptor } from '@progress/kendo-data-query';
+import { DataItemWrapper } from './DataItemWrapper.js';
+/**
+ * Orders the specified tree according to the provided sort descriptors.
+ *
+ * @param {T[]} data - The data that will be sorted.
+ * @param {SortDescriptor[]} descriptors - The descriptors by which the data will be sorted.
+ * @param {string} subItemsField - The field which points to the subitems collection of each data item.
+ * @returns {T[]} - The sorted data.
+ */
+export declare function orderBy(data: any[], descriptors: SortDescriptor[], subItemsField: string): any[];
+/**
+ * Filters the provided data tree according to the specified `Array<FilterDescriptor|CompositeFilterDescriptor>`.
+ *
+ * @param {T[]} data - The data that will be filtered.
+ * @param {FilterDescriptor[]|CompositeFilterDescriptor[]} descriptors - The filter criteria that will be applied.
+ * @param {string} subItemsField - The field which points to the subitems collection of each data item.
+ * @returns {T[]} - The filtered data.
+ */
+export declare function filterBy(data: any[], descriptors: FilterDescriptor[] | CompositeFilterDescriptor[], subItemsField: string): any[];
+/**
+ * @hidden
+ */
+export declare function flatData(data: any[], getChildren: (dataItem: any) => any[], itemMap: (item: any) => any): DataItemWrapper[];
+/**
+ * Creates a flat data array from the passed tree dataset.
+ *
+ * @param {object[]} dataset - The source dataset of data items.
+ * @param {string} expandField - The field which points to the expanded value of each data item.
+ * @param {string} subItemsField - The field which points to the subitems collection of each data item.
+ * @returns {object[]} - A collection of the generated data items that are in a flat structure.
+ */
+export declare const treeToFlat: (data: any[], expandField: string, subItemsField: string) => any[];
+/**
+ * Creates a tree from the passed dataset.
+ *
+ * @param {object[]} dataset - The source dataset of data items.
+ * @param {(item: object) => any} getId - A function which will return the id of the data item.
+ * @param {(item: object) => any} getParentId - A function which will return the data item id of its parent data item.
+ * @param {string} subItemsField - The field which points to the subitems collection of each data item.
+ * @returns {object[]} - A collection of the generated data items that are structured in a tree.
+ */
+export declare const createDataTree: (dataset: any[], getId: (item: any) => any, getParentId: (item: any) => any, subItemsField: string) => any[];
+/**
+ * Similar to the `Object.assign` function. Additionally, creates a new array for the subitems.
+ *
+ * @param {object} item - The source data item.
+ * @param {string} subItemsField - The field which points to the subitems collection of each data item.
+ * @param {object} propsToExtend - The props with which the source data item will be extended.
+ * @returns {object} - The target data item.
+ */
+export declare const extendDataItem: (item: any, subItemsField: string, propsToExtend?: any) => any;
+/**
+ * Removes the items from the passed `data` which match the passed `condition`.
+ *
+ * @param {any[]} data - The data tree.
+ * @param {string} subItemsField - The field which points to the subitems collection of each data item.
+ * @param {(item: object) => Boolean} condition - A function that will be executed for each data item
+ * in the tree data and the items for which returns true will be removed.
+ * @returns {any[]} - The new data tree.
+ */
+export declare const removeItems: (data: any[], subItemsField: string, condition: (item: any) => boolean) => any[];
+/**
+ * Changes the `subItems` collection of each data item which matches the passed `condition`.
+ *
+ * @param {any[]} data - The data tree.
+ * @param {string} subItemsField - The field which points to the subitems collection of each data item.
+ * @param {(item: object) => Boolean} condition - A function that will be executed for each data item and
+ * will return `true` for items that have to change the subitems collection.
+ * @param {(subItems: object[]) => object[]} change - A function which
+ * has as a parameter the subitems collection of the matched items and which will return the new subitems collection.
+ * @returns {any[]} - The new data tree.
+ */
+export declare const modifySubItems: (data: any[], subItemsField: string, condition: (item: any) => boolean, change: (subItems: any[]) => any[]) => any[];
+/**
+ * Returns the data item path in the tree based on the level parameter.
+ *
+ * @param {any[]} tree - The data tree.
+ * @param {number[]} level - The level of the target tree item.
+ * @param {string} subItemsField - The field which points to the subitems collection of each data item.
+ * @returns {any[]} - The path of the data item.
+ */
+export declare const getItemPath: (tree: any[], level: number[], subItemsField?: string) => any[];
+/**
+ * Moves the targeted item in the tree to another position.
+ *
+ * @param {any[]} data - The data tree.
+ * @param {number[]} target - The level of the target tree item which will be moved.
+ * @param {number[] | null} destination - The level of the destination tree item where the target item will be moved in.
+ * If it is null, the target item will be added at the root level.
+ * @param {string} subItemsField - The field which points to the subitems collection of each data item.
+ * @returns {any[]} - The new data tree.
+ */
+export declare const moveTreeItem: (data: any[], target: number[], destination: number[] | null, subItemsField: string) => any[];
+/** @hidden */
+export declare const getSearchFromString: (search: CompositeFilterDescriptor, value: string) => CompositeFilterDescriptor;
+/** @hidden */
+export declare const getStringFromSearch: (search: CompositeFilterDescriptor | undefined) => string;
+/** @hidden */
+export declare const combineFilters: (first?: CompositeFilterDescriptor, second?: CompositeFilterDescriptor) => CompositeFilterDescriptor | undefined;

package/utils/group-operations.d.ts

@@ -0,0 +1,36 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+import { GroupDescriptor } from '@progress/kendo-data-query';
+/**
+ * Add unique ids to the group items inside data.
+ *
+ * @param {{data: any[], group: GroupDescriptor[]}} options - The options to be processed.
+ */
+export declare const setGroupIds: (options: {
+    data: any;
+    group?: Array<GroupDescriptor>;
+}) => void;
+/**
+ * Get all group ids from the data.
+ *
+ * @param {{data: any[]}} options - The options to be processed.
+ * @returns {string[]} - Collection of all group ids from the data.
+ */
+export declare const getGroupIds: (options: {
+    data: any;
+}) => string[];
+/**
+ * Apply the `expanded` prop to the group items in data based on the provided collection of group ids.
+ *
+ * @param {{data: any[], collapsedIds: string[]}} options - The options to be processed.
+ * @returns {string[]} - Collection of all group ids from the data.
+ */
+export declare const setExpandedState: (options: {
+    data: any;
+    collapsedIds: string[];
+}) => any[];