@progress/kendo-react-common/Draggable.d.ts

React Common package delivers common utilities that can be used with the KendoReact UI components. KendoReact Common Utilities package

/**
 * @license
 *-------------------------------------------------------------------------------------------
 * Copyright © 2026 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the package root for more information
 *-------------------------------------------------------------------------------------------
 */
import { DraggableOptions, DraggableHandle } from './hooks/index.js';
import { NormalizedDragEvent } from '@progress/kendo-draggable-common';
import * as React from 'react';
/** @hidden */
interface BaseDraggableEvent {
    /**
     * The DOM element.
     */
    element: HTMLElement;
    /**
     * The target Draggable reference.
     */
    target: DraggableHandle;
    /**
     * The normalized drag event.
     */
    event: NormalizedDragEvent;
}
/**
 * Represents the object of the `onPress` callback.
 */
export interface DraggablePressEvent extends BaseDraggableEvent {
}
/**
 * Represents the object of the `onDragStart` callback.
 */
export interface DraggableDragStartEvent extends BaseDraggableEvent {
}
/**
 * Represents the object of the `onDrag` callback.
 */
export interface DraggableDragEvent extends BaseDraggableEvent {
}
/**
 * Represents the object of the `onDragEnd` callback.
 */
export interface DraggableDragEndEvent extends BaseDraggableEvent {
}
/**
 * Represents the object of the `onRelease` callback.
 */
export interface DraggableReleaseEvent extends BaseDraggableEvent {
}
/**
 * Represents the props of the KendoReact Draggable component.
 */
export interface DraggableProps extends DraggableOptions {
    /**
     * Fires when the user press element inside the Draggable component.
     */
    onPress?: (event: DraggablePressEvent) => void;
    /**
     * Fires when the user starts dragging the element inside the Draggable component.
     */
    onDragStart?: (event: DraggableDragStartEvent) => void;
    /**
     * Fires when the user drag the element inside the Draggable component.
     */
    onDrag?: (event: DraggableDragEvent) => void;
    /**
     * Fires when the user finishes dragging the element inside the Draggable component.
     */
    onDragEnd?: (event: DraggableDragEndEvent) => void;
    /**
     * Fires when the user release the current drag action.
     */
    onRelease?: (event: DraggableReleaseEvent) => void;
    /**
     * Callback to get the child element ref. Useful as the Draggable overrides ref of the child element.
     */
    childRef?: React.Ref<HTMLElement | null | {
        element: HTMLElement | null;
        [key: string]: any;
    }>;
    /** @hidden */
    children?: React.ReactNode;
}
/**
 * Represents the KendoReact Draggable component.
 *
 * Accepts properties of type [DraggableProps](https://www.telerik.com/kendo-react-ui/components/common/api/draggableprops),
 * and returns an object of type [DraggableHandle](https://www.telerik.com/kendo-react-ui/components/common/api/draggablehandle) when the `ref` is obtained.
 */
export declare const Draggable: React.ForwardRefExoticComponent<DraggableProps & React.RefAttributes<DraggableHandle | null>>;
export type Draggable = DraggableHandle;
export {};