@progress/kendo-react-treeview 7.2.4-develop.3 → 7.2.4-develop.4

package/TreeViewDragClue.d.ts

@@ -1,148 +0,0 @@
-/**-----------------------------------------------------------------------------------------
-* Copyright © 2024 Progress Software Corporation. All rights reserved.
-* Licensed under commercial license. See LICENSE.md in the package root for more information
-*-------------------------------------------------------------------------------------------*/
-import * as React from 'react';
-/**
- * Represents the props of the KendoReact TreeViewDragClue component.
- */
-export interface TreeViewDragClueProps {
-    /**
-     * Sets custom CSS styles to the component.
-     * When specified, the default CSS styles are removed.
-     */
-    style?: React.CSSProperties;
-}
-/**
- * @hidden
- */
-export interface TreeViewDragClueState {
-    visible?: boolean;
-    top?: number;
-    left?: number;
-    text?: string;
-    operationClassName?: string;
-}
-/**
- * Represents the KendoReact TreeViewDragClue component which renders a clue when an item is dragged.
- *
- * @example
- * ```jsx
- * class App extends React.Component {
- *     dragClue;
- *     state = { tree };
- *
- *     render() {
- *         return (
- *             <div>
- *                 <TreeView data={this.state.tree} draggable={true}
- *                     onItemDragOver={this.onItemDragOver} onItemDragEnd={this.onItemDragEnd} />
- *                 <TreeViewDragClue ref={dragClue => this.dragClue = dragClue} />
- *             </div>
- *         );
- *     }
- *
- *     onItemDragOver = (event) => {
- *         this.dragClue.show(event.pageY + 10, event.pageX, event.item.text, this.getClueClassName(event));
- *     }
- *     onItemDragEnd = (event) => {
- *         this.dragClue.hide();
- *         const eventAnalyzer = new TreeViewDragAnalyzer(event).init();
- *
- *         if (eventAnalyzer.isDropAllowed) {
- *             const updatedTree = moveTreeViewItem(
- *                 event.itemHierarchicalIndex,
- *                 this.state.tree,
- *                 eventAnalyzer.getDropOperation(),
- *                 eventAnalyzer.destinationMeta.itemHierarchicalIndex,
- *             );
- *
- *             this.setState({ tree: updatedTree });
- *         }
- *     }
- *     getClueClassName(event) {
- *         const eventAnalyzer = new TreeViewDragAnalyzer(event).init();
- *         const itemIndex = eventAnalyzer.destinationMeta.itemHierarchicalIndex;
- *
- *         if (eventAnalyzer.isDropAllowed) {
- *             switch (eventAnalyzer.getDropOperation()) {
- *                 case 'child':
- *                     return 'k-i-plus';
- *                 case 'before':
- *                     return itemIndex === '0' || itemIndex.endsWith(`${SEPARATOR}0`) ?
- *                         'k-i-insert-up' : 'k-i-insert-middle';
- *                 case 'after':
- *                     const siblings = getSiblings(itemIndex, this.state.tree);
- *                     const lastIndex = Number(itemIndex.split(SEPARATOR).pop());
- *
- *                     return lastIndex < siblings.length - 1 ? 'k-i-insert-middle' : 'k-i-insert-down';
- *                 default:
- *                     break;
- *             }
- *         }
- *
- *         return 'k-i-cancel';
- *     }
- * }
- *
- * function getSiblings(itemIndex, data) {
- *     let result = data;
- *
- *     const indices = itemIndex.split(SEPARATOR).map(index => Number(index));
- *     for (let i = 0; i < indices.length - 1; i++) {
- *         result = result[indices[i]].items;
- *     }
- *
- *     return result;
- * }
- *
- * const SEPARATOR = '_';
- * const tree = [{
- *     text: 'Furniture', expanded: true, items: [
- *         { text: 'Tables & Chairs', expanded: true },
- *         { text: 'Sofas', expanded: true },
- *         { text: 'Occasional Furniture', expanded: true }]
- * }, {
- *     text: 'Decor', expanded: true, items: [
- *         { text: 'Bed Linen', expanded: true },
- *         { text: 'Curtains & Blinds', expanded: true },
- *         { text: 'Carpets', expanded: true }]
- * }];
- *
- * ReactDOM.render(<App />, document.querySelector('my-app'));
- * ```
- */
-export declare class TreeViewDragClue extends React.PureComponent<TreeViewDragClueProps, TreeViewDragClueState> {
-    /**
-     * @hidden
-     */
-    static defaultProps: {
-        style: {
-            display: string;
-            position: string;
-            zIndex: number;
-            padding: string;
-        };
-    };
-    /**
-     * @hidden
-     */
-    readonly state: TreeViewDragClueState;
-    /**
-     * @hidden
-     */
-    render(): false | import("react/jsx-runtime").JSX.Element | undefined;
-    /**
-     * Displays the TreeViewDragClue component.
-     *
-     * @param top - The `top` CSS position of the component.
-     * @param left - The `left` CSS position of the component.
-     * @param text - The text of the component.
-     * @param operationClassName - The CSS class name which is related to the specific drop operation.
-     */
-    show(top: number, left: number, text: string, operationClassName: string): void;
-    /**
-     * Hides the TreeViewDragClue component.
-     */
-    hide(): void;
-}

package/TreeViewItem.d.ts

@@ -1,106 +0,0 @@
-/**-----------------------------------------------------------------------------------------
-* Copyright © 2024 Progress Software Corporation. All rights reserved.
-* Licensed under commercial license. See LICENSE.md in the package root for more information
-*-------------------------------------------------------------------------------------------*/
-import * as React from 'react';
-import { TreeFieldsService } from '@progress/kendo-react-common';
-/**
- * @hidden
- */
-export declare const TreeViewItemPropsContext: React.Context<(props: TreeViewItemProps) => TreeViewItemProps>;
-/**
- * @hidden
- */
-export interface TreeViewItemProps {
-    item: any;
-    itemId: string;
-    treeGuid: string;
-    animate: boolean;
-    focusedItemId?: string;
-    tabbableItemId: string;
-    fieldsService: TreeFieldsService;
-    itemUI?: React.ComponentType<{
-        item: any;
-        itemHierarchicalIndex: string;
-    }>;
-    ariaMultiSelectable: boolean;
-    onItemClick: any;
-    expandIcons?: boolean;
-    onExpandChange: any;
-    onCheckChange: any;
-    checkboxes?: boolean;
-    onFocusDomElNeeded: any;
-    draggable?: boolean;
-    onPress: any;
-    onDrag: any;
-    onRelease: any;
-    size?: null | 'small' | 'medium' | 'large';
-    /**
-     * @hidden
-     *
-     * Internal usage!!!
-     */
-    position?: 'top' | 'mid' | 'bot';
-    /**
-     * Currently for internal usage only! Replicates the current behavior which disables all children
-     * if the parent is disabled, which was previously achieved only though the kendo-themes,
-     * but due to rendering changes had to be replicated programmatically!
-     *
-     * @hidden
-     */
-    disabled?: boolean;
-    /**
-     * @hidden
-     */
-    isRtl?: boolean;
-    /**
-     * @hidden
-     */
-    onContextMenu: (event: React.MouseEvent<HTMLElement>, item: any, itemId: string) => void;
-    /**
-     * @hidden
-     * This prop comes from the `TreeView`component.
-     * It replaces the previously used guid() function and is used to generate unique `id` for
-     * the checkbox and label in the TreeViewItem.
-     */
-    id?: string;
-}
-/**
- * @hidden
- */
-declare class TreeViewItemWithoutContext extends React.Component<TreeViewItemProps> {
-    private itemElement;
-    private checkboxElement;
-    static defaultProps: {
-        position: string;
-    };
-    render(): import("react/jsx-runtime").JSX.Element;
-    componentDidMount(): void;
-    componentDidUpdate(prevProps: TreeViewItemProps): void;
-    private renderCheckbox;
-    private renderExpandIcon;
-    private renderSubitemsIfApplicable;
-    private renderItemInPart;
-    private onCheckChange;
-    private onExpandChange;
-    private onItemClick;
-    private onPress;
-    private onDrag;
-    private onRelease;
-    private onContextMenu;
-    private get fieldsSvc();
-    private get itemId();
-    private get item();
-    private get tabIndex();
-    private get ariaExpanded();
-    private get disabled();
-    private get ariaChecked();
-    private get ariaSelected();
-    private getIconProps;
-    private assignDraggableMeta;
-}
-/**
- * @hidden
- */
-export declare const TreeViewItem: React.ForwardRefExoticComponent<Omit<TreeViewItemProps & React.RefAttributes<TreeViewItemWithoutContext>, "ref"> & React.RefAttributes<any>>;
-export {};

package/TreeViewOperationDescriptors.d.ts

@@ -1,80 +0,0 @@
-/**-----------------------------------------------------------------------------------------
-* Copyright © 2024 Progress Software Corporation. All rights reserved.
-* Licensed under commercial license. See LICENSE.md in the package root for more information
-*-------------------------------------------------------------------------------------------*/
-/**
- * The descriptors of the data operations which are applied to the TreeView component.
- */
-export interface TreeViewOperationDescriptors {
-    /**
-     * The hierarchical indices of the items to which the expand operation will be applied, or the descriptor of the operation.
-     */
-    expand?: string[] | TreeViewOperationDescriptor;
-    /**
-     * The hierarchical indices of the items to which the select operation will be applied, or the descriptor of the operation.
-     */
-    select?: string[] | TreeViewOperationDescriptor;
-    /**
-     * The hierarchical indices of the items to which the check operation will be applied, or the descriptor of the operation.
-     */
-    check?: string[] | TreeViewCheckDescriptor;
-    /**
-     * When the operations are applied, the corresponding items and their parents are cloned.
-     * For performance reasons, TreeView items are cloned only once.
-     * The name of the field which provides a Boolean representation of whether an item is already cloned.
-     * Defaults to `cloned`.
-     */
-    cloneField?: string;
-    /**
-     * The expand field of the item.
-     */
-    expandField?: string;
-    /**
-     * The select field of the item.
-     */
-    selectField?: string;
-    /**
-     * The check field of the item.
-     */
-    checkField?: string;
-    /**
-     * The children field of the item.
-     */
-    childrenField?: string;
-}
-/**
- * The descriptor which is used for expanding, selecting, and checking.
- */
-export interface TreeViewOperationDescriptor {
-    /**
-     * The IDs of the items to which the operation will be applied. By default, the TreeView applies the hierarchical indices of the items. These indices are zero-based. The first root item has a `0` (zero) index. If the first root item has children, the first child acquires a `0_0` index and the second acquires a `0_1` index.
-     */
-    ids?: any[];
-    /**
-     * The name of the field which will provide a Boolean representation for the operation state of the item.
-     *
-     * The default fields are:
-     * * `expanded`—Indicates that an item is expanded.
-     * * `selected`—Indicates that an item is selected.
-     * * `checked`—Indicates that an item is checked.
-     */
-    operationField?: string;
-    /**
-     * The name of the field which will uniquely describe an item as an alternative to its hierarchical index.
-     */
-    idField?: string;
-}
-/**
- * The descriptor which is used for checking.
- */
-export interface TreeViewCheckDescriptor extends TreeViewOperationDescriptor {
-    /**
-     * Determines if a parent item will have an indeterminate state when not all its children are checked.
-     */
-    applyCheckIndeterminate?: boolean;
-    /**
-     * The name of the field which will provide a Boolean representation for the indeterminate state of a parent item.
-     * Defaults to `checkIndeterminate`.
-     */
-    checkIndeterminateField?: string;
-}

package/TreeViewProps.d.ts

@@ -1,149 +0,0 @@
-/**-----------------------------------------------------------------------------------------
-* Copyright © 2024 Progress Software Corporation. All rights reserved.
-* Licensed under commercial license. See LICENSE.md in the package root for more information
-*-------------------------------------------------------------------------------------------*/
-import { CSSProperties, ComponentType } from 'react';
-import * as events from './events';
-import { ItemRenderProps } from './ItemRenderProps';
-import { TreeViewContextMenuEvent } from './events';
-/**
- * Represents the props of the [KendoReact TreeView component]({% slug overview_treeview %}).
- */
-export interface TreeViewProps {
-    /**
-     * Sets a class of the TreeView DOM element.
-     */
-    className?: string;
-    /**
-     * Sets an `id` of the TreeView DOM element.
-     */
-    id?: string;
-    /**
-     * Sets the `style`attribute of the TreeView DOM element.
-     */
-    style?: CSSProperties;
-    /**
-     * Sets the data of the TreeView ([more information and examples]({% slug databinding_treeview %})).
-     */
-    data?: any[] | null;
-    /**
-     * Controls the animation. By default, the expand and collapse animations are enabled.
-     */
-    animate?: boolean;
-    /**
-     * Sets a tabIndex of the TreeView DOM element.
-     */
-    tabIndex?: number;
-    /**
-     * The TreeView has a built-in implementation of focusing and keyboard navigation. By default, the component uses hierarchical indices to uniquely match the focused item. You can use the `focusIdField` prop for specifying the name of the field which will uniquely describe an item as an alternative to its hierarchical index ([see example]({% slug datareload_treeview %}#toc-using-item-ids)).
-     */
-    focusIdField?: string;
-    /**
-     * When `focusIdField` is set, the TreeView executes a depth-first search on the data to find the currently focused item. The `getFocusHierarchicalIndex` prop specifies the function that will be used as an alternative to the default search algorithm.
-     */
-    getFocusHierarchicalIndex?: (itemId: any) => string | undefined;
-    /**
-     * Controls the rendering of the expand (collapse) icons. By default, the icons are not rendered ([see example]({% slug expansion_ways_treeview %})).
-     */
-    expandIcons?: boolean;
-    /**
-     * Fires when the expanding or collapsing of an item is requested ([see example]({% slug expansion_ways_treeview %})).
-     */
-    onExpandChange?: (event: events.TreeViewExpandChangeEvent) => void;
-    /**
-     * Fires when an item is clicked or when `Enter` is pressed on a focused item ([see example]({% slug selection_ways_treeview %})).
-     */
-    onItemClick?: (event: events.TreeViewItemClickEvent) => void;
-    /**
-     * Specifies the name of the field which will provide a Boolean representation for the expanded state of the item. Defaults to `expanded`.
-     */
-    expandField?: string;
-    /**
-     * Specifies the name of the field which will provide a Boolean representation for the selected state of the item. Defaults to `selected`.
-     */
-    selectField?: string;
-    /**
-     * Specifies the name of the field which indicates to the TreeView that an item has children even if the children are not initially passed. Used for implementing the load-on-demand feature ([see example]({% slug databinding_treeview %}#toc-loading-data-on-demand)). Defaults to `hasChildren`.
-     */
-    hasChildrenField?: string;
-    /**
-     * Specifies the name of the field which will provide an array representation of the item children.
-     */
-    childrenField?: string;
-    /**
-     * Specifies the name of the field which will provide a text representation for the item. Defaults to `text`.
-     */
-    textField?: string;
-    /**
-     * Specifies the name of the field which will provide a Boolean representation for the disabled state of the item. Defaults to `disabled`.
-     */
-    disableField?: string;
-    /**
-     * Defines the component that will be used for rendering each of the TreeView items ([see example]({% slug rendering_treeview %})).
-     */
-    item?: ComponentType<ItemRenderProps>;
-    /**
-     * Indicates that the user can select more than one TreeView items. If the TreeView is in a multiple selection mode, set the `aria-multiselectable` prop to `true` ([more on accessibility by the TreeView]({% slug accessibility_treeview %})).
-     */
-    'aria-multiselectable'?: boolean | 'false' | 'true';
-    /**
-     * Defines a string value that labels the TreeView ([more on accessibility by the TreeView]({% slug accessibility_treeview %})).
-     */
-    'aria-label'?: string;
-    /**
-     * Identifies the element or elements which will label the TreeView ([more on accessibility by the TreeView]({% slug accessibility_treeview %})).
-     */
-    'aria-labelledby'?: string;
-    /**
-     * Controls the rendering of checkboxes. By default, the checkboxes are not rendered ([see example]({% slug check_items_directly_treeview %})).
-     */
-    checkboxes?: boolean;
-    /**
-     * Specifies the name of the field which will provide a Boolean representation for the checked state of the item. Defaults to `checked`.
-     */
-    checkField?: string;
-    /**
-     * Specifies the name of the field which will provide a Boolean representation for the check indeterminate state of the item. Defaults to `checkIndeterminate`.
-     */
-    checkIndeterminateField?: string;
-    /**
-     * Fires when a checkbox is clicked or when `Space` is pressed on a focused item ([see example]({% slug check_items_directly_treeview %})).
-     */
-    onCheckChange?: (event: events.TreeViewCheckChangeEvent) => void;
-    /**
-     * Controls the dispatching of the `drag` events. By default, the `drag` events are not dispatched ([see example]({% slug dragdrop_treeview %})).
-     */
-    draggable?: boolean;
-    /**
-     * Fires when the dragging of an item has started.
-     */
-    onItemDragStart?: (event: events.TreeViewItemDragStartEvent) => void;
-    /**
-     * Fires when a dragged item changes its position ([see example]({% slug dragdrop_treeview %})).
-     */
-    onItemDragOver?: (event: events.TreeViewItemDragOverEvent) => void;
-    /**
-     * Fires when a dragged item is dropped ([see example]({% slug dragdrop_treeview %})).
-     */
-    onItemDragEnd?: (event: events.TreeViewItemDragEndEvent) => void;
-    /**
-     * Configures the `size` of the TreeView.
-     *
-     * The available options are:
-     * - small
-     * - medium
-     * - large
-     * - null&mdash;Does not set a size `className`.
-     *
-     * @default `medium`
-     */
-    size?: null | 'small' | 'medium' | 'large';
-    /**
-     * Sets the direction of the component.
-     */
-    dir?: string;
-    /**
-     * The event that is fired when the ContextMenu is activated.
-     */
-    onContextMenu?: (event: TreeViewContextMenuEvent) => void;
-}

package/events.d.ts

@@ -1,162 +0,0 @@
-/**-----------------------------------------------------------------------------------------
-* Copyright © 2024 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';
-import { TreeView } from './TreeView';
-/**
- * Represents the object of the `onExpandChange` event ([see example]({% slug overview_treeview %}#toc-basic-usage)).
- */
-export interface TreeViewExpandChangeEvent extends BaseEvent<TreeView> {
-    /**
-     * The item that is expanded or collapsed.
-     */
-    item: any;
-    /**
-     * The hierarchical index of the item. The indices are zero-based. The first root item has a `0` (zero) index. If the first root item has children, the first child acquires a `0_0` index and the second acquires a `0_1` index.
-     */
-    itemHierarchicalIndex: string;
-}
-/**
- * Represents the object of the `onItemClick` event ([see example]({% slug overview_treeview %}#toc-basic-usage)).
- */
-export interface TreeViewItemClickEvent extends BaseEvent<TreeView> {
-    /**
-     * The item that is clicked.
-     */
-    item: any;
-    /**
-     * The hierarchical index of the item. The indices are zero-based.
-     * The first root item has a `0` (zero) index. If the first root item has children, the first child acquires a `0_0` index and the second acquires a `0_1` index.
-     */
-    itemHierarchicalIndex: string;
-}
-/**
- * Represents the object of the `onCheckChange` event ([see example]({% slug check_helper_funcs_treeview %})).
- */
-export interface TreeViewCheckChangeEvent extends BaseEvent<TreeView> {
-    /**
-     * The item that is selected or deselected.
-     */
-    item: any;
-    /**
-     * The hierarchical index of the item. The indices are zero-based.
-     * The first root item has a `0` (zero) index. If the first root item has children, the first child acquires a `0_0` index and the second acquires a `0_1` index.
-     */
-    itemHierarchicalIndex: string;
-}
-/**
- * Represents the object of the `onContextMenu` event ([see example]({% slug overview_treeview %}#toc-basic-usage)).
- */
-export interface TreeViewContextMenuEvent extends BaseEvent<TreeView> {
-    /**
-     * An event target.
-     */
-    target: TreeView;
-    /**
-     * The data object that represents the current item.
-     */
-    item: any;
-    /**
-     * The ID of the current item.
-     */
-    itemID: string;
-    /**
-     * A React Synthetic Event.
-     */
-    syntheticEvent: React.MouseEvent<any>;
-}
-/**
- * Represents the object of the `onItemDragStart` event.
- */
-export interface TreeViewItemDragStartEvent {
-    /**
-     * An event target.
-     */
-    target: TreeView;
-    /**
-     * The item that is dragged.
-     */
-    item: any;
-    /**
-     * The hierarchical index of the dragged item. The indices are zero-based.
-     * The first root item has a `0` (zero) index. If the first root item has children, the first child acquires a `0_0` index and the second acquires a `0_1` index.
-     */
-    itemHierarchicalIndex: string;
-}
-/**
- * Represents the object of the `onItemDragOver` event ([see example]({% slug dragdrop_treeview %})).
- */
-export interface TreeViewItemDragOverEvent {
-    /**
-     * The target that is associated with the dragged item.
-     */
-    target: TreeView;
-    /**
-     * The item that is dragged.
-     */
-    item: any;
-    /**
-     * The hierarchical index of the dragged item. The indices are zero-based.
-     * The first root item has a `0` (zero) index. If the first root item has children, the first child acquires a `0_0` index and the second acquires a `0_1` index.
-     */
-    itemHierarchicalIndex: string;
-    /**
-     * The X (horizontal) coordinate (in pixels) at which the event occurred that is relative to the left edge of the entire document.
-     * Includes any portion of the document which is not currently visible.
-     */
-    pageX: number;
-    /**
-     * The Y (vertical) coordinate (in pixels) at which the event occurred that is relative to the whole document.
-     * `pageY` observes any vertical scrolling of the page.
-     */
-    pageY: number;
-    /**
-     * Provides the horizontal coordinate within the client area of the application at which the event occurred
-     * (as opposed to the coordinate within the page).
-     */
-    clientX: number;
-    /**
-     * Provides the vertical coordinate within the client area of the application at which the event occurred
-     * (as opposed to the coordinate within the page).
-     */
-    clientY: number;
-}
-/**
- * Represents the object of the `onItemDragEnd` event ([see example]({% slug dragdrop_treeview %})).
- */
-export interface TreeViewItemDragEndEvent {
-    /**
-     * The target that is associated with the dragged item.
-     */
-    target: TreeView;
-    /**
-     * The item that is dragged.
-     */
-    item: any;
-    /**
-     * The hierarchical index of the dragged item. The indices are zero-based.
-     * The first root item has a `0` (zero) index. If the first root item has children, the first child acquires a `0_0` index and the second acquires a `0_1` index.
-     */
-    itemHierarchicalIndex: string;
-    /**
-     * The X (horizontal) coordinate (in pixels) at which the event occured that is relative to the left edge of the entire document.
-     * `pageX` includes any portion of the document that is not currently visible.
-     */
-    pageX: number;
-    /**
-     * The Y (vertical) coordinate (in pixels) at which the event occured that is relative to the whole document.
-     * `pageY` observes any vertical scrolling of the page.
-     */
-    pageY: number;
-    /**
-     * Provides the horizontal coordinate within the client area of the application at which the event occurred
-     * (as opposed to the coordinate within the page).
-     */
-    clientX: number;
-    /**
-     * Provides the vertical coordinate within the client area of the application at which the event occurred
-     * (as opposed to the coordinate within the page).
-     */
-    clientY: number;
-}