@progress/kendo-react-common 9.5.0-develop.1 → 9.5.0-develop.2

package/index.d.mts

@@ -7,6 +7,8 @@
  */
 import { default as default_2 } from 'prop-types';
 import { default as default_3 } from 'react';
+import { DragTarget } from '@progress/kendo-draggable-common';
+import { DropTarget } from '@progress/kendo-draggable-common';
 import { JSX as JSX_2 } from 'react/jsx-runtime';
 import { NormalizedDragEvent } from '@progress/kendo-draggable-common';
 import * as React_2 from 'react';
@@ -1127,6 +1129,22 @@ export declare const DragAndDrop: {
     displayName: string;
 };
 
+/**
+ * @hidden
+ */
+declare const DragAndDropContext: React_2.Context<{
+    drag?: React_2.RefObject<DragTarget> | null | undefined;
+    setDrag?: ((value: React_2.RefObject<DragTarget> | null) => void) | undefined;
+    drop?: React_2.RefObject<DropTarget> | null | undefined;
+    setDrop?: ((value: React_2.RefObject<DropTarget> | null) => void) | undefined;
+    drags?: React_2.RefObject<DragTarget>[] | undefined;
+    registerDrag?: ((item: React_2.RefObject<DragTarget>) => void) | undefined;
+    deregisterDrag?: ((item: React_2.RefObject<DragTarget>) => void) | undefined;
+    drops?: React_2.RefObject<DropTarget>[] | undefined;
+    registerDrop?: ((item: React_2.RefObject<DropTarget>) => void) | undefined;
+    deregisterDrop?: ((item: React_2.RefObject<DropTarget>) => void) | undefined;
+}>;
+
 /**
  * Represents the properties of the `DragAndDrop` component.
  */
@@ -1135,6 +1153,10 @@ export declare interface DragAndDropProps {
      * Represents the `children` of the `DragAndDrop` component. The `children` prop can be any valid React Element.
      */
     children?: React_2.ReactNode;
+    /**
+     * Allows passing a custom context to the `DragAndDrop` component. Useful when there are multiple drag-and-drop functionalities in a single component.
+     */
+    context?: typeof DragAndDropContext;
 }
 
 /**
@@ -1206,6 +1228,10 @@ export declare interface DraggableOptions {
     scrollContainer?: React_2.RefObject<HTMLElement | null | {
         element: HTMLElement | null;
     }>;
+    /**
+     * Allows passing custom context. Use it to isolate drag and drop events in scenarios with multiple drag and drop functionalities on a single component.
+     */
+    context?: typeof DragAndDropContext;
 }
 
 /**
@@ -1568,10 +1594,20 @@ export declare interface DroppableHandle {
     element?: HTMLElement;
 }
 
+/**
+ * Represents the configuration object type of the `Droppable` component and `useDroppable` hook.
+ */
+export declare interface DroppableOptions {
+    /**
+     * The context to use for the droppable.
+     */
+    context?: typeof DragAndDropContext;
+}
+
 /**
  * Represents the props of the KendoReact Droppable component.
  */
-export declare interface DroppableProps {
+export declare interface DroppableProps extends DroppableOptions {
     /**
      * Fires when the user enters the element during drag.
      */
@@ -3843,6 +3879,7 @@ export declare function useDraggable(ref: React_2.RefObject<HTMLElement | null |
  *
  * @param ref - The `ref` of the HTML Element or React Component which will enable the `droppable` functionality.
  * @param callbacks - A collection of callbacks, called by the `useDroppable` hook when a specific action occurs.
+ * @param options - The options for the `useDroppable` hook.
  */
 export declare function useDroppable(ref: React_2.RefObject<HTMLElement | null | {
     element: HTMLElement | null;
@@ -3851,7 +3888,7 @@ export declare function useDroppable(ref: React_2.RefObject<HTMLElement | null |
     onDragOver?: (event: NormalizedDragEvent) => void;
     onDragLeave?: (event: NormalizedDragEvent) => void;
     onDrop?: (event: NormalizedDragEvent) => void;
-}): void;
+}, options?: DroppableOptions): void;
 
 /** @hidden */
 export declare function useId(id?: string): any;

package/index.d.ts

@@ -7,6 +7,8 @@
  */
 import { default as default_2 } from 'prop-types';
 import { default as default_3 } from 'react';
+import { DragTarget } from '@progress/kendo-draggable-common';
+import { DropTarget } from '@progress/kendo-draggable-common';
 import { JSX as JSX_2 } from 'react/jsx-runtime';
 import { NormalizedDragEvent } from '@progress/kendo-draggable-common';
 import * as React_2 from 'react';
@@ -1127,6 +1129,22 @@ export declare const DragAndDrop: {
     displayName: string;
 };
 
+/**
+ * @hidden
+ */
+declare const DragAndDropContext: React_2.Context<{
+    drag?: React_2.RefObject<DragTarget> | null | undefined;
+    setDrag?: ((value: React_2.RefObject<DragTarget> | null) => void) | undefined;
+    drop?: React_2.RefObject<DropTarget> | null | undefined;
+    setDrop?: ((value: React_2.RefObject<DropTarget> | null) => void) | undefined;
+    drags?: React_2.RefObject<DragTarget>[] | undefined;
+    registerDrag?: ((item: React_2.RefObject<DragTarget>) => void) | undefined;
+    deregisterDrag?: ((item: React_2.RefObject<DragTarget>) => void) | undefined;
+    drops?: React_2.RefObject<DropTarget>[] | undefined;
+    registerDrop?: ((item: React_2.RefObject<DropTarget>) => void) | undefined;
+    deregisterDrop?: ((item: React_2.RefObject<DropTarget>) => void) | undefined;
+}>;
+
 /**
  * Represents the properties of the `DragAndDrop` component.
  */
@@ -1135,6 +1153,10 @@ export declare interface DragAndDropProps {
      * Represents the `children` of the `DragAndDrop` component. The `children` prop can be any valid React Element.
      */
     children?: React_2.ReactNode;
+    /**
+     * Allows passing a custom context to the `DragAndDrop` component. Useful when there are multiple drag-and-drop functionalities in a single component.
+     */
+    context?: typeof DragAndDropContext;
 }
 
 /**
@@ -1206,6 +1228,10 @@ export declare interface DraggableOptions {
     scrollContainer?: React_2.RefObject<HTMLElement | null | {
         element: HTMLElement | null;
     }>;
+    /**
+     * Allows passing custom context. Use it to isolate drag and drop events in scenarios with multiple drag and drop functionalities on a single component.
+     */
+    context?: typeof DragAndDropContext;
 }
 
 /**
@@ -1568,10 +1594,20 @@ export declare interface DroppableHandle {
     element?: HTMLElement;
 }
 
+/**
+ * Represents the configuration object type of the `Droppable` component and `useDroppable` hook.
+ */
+export declare interface DroppableOptions {
+    /**
+     * The context to use for the droppable.
+     */
+    context?: typeof DragAndDropContext;
+}
+
 /**
  * Represents the props of the KendoReact Droppable component.
  */
-export declare interface DroppableProps {
+export declare interface DroppableProps extends DroppableOptions {
     /**
      * Fires when the user enters the element during drag.
      */
@@ -3843,6 +3879,7 @@ export declare function useDraggable(ref: React_2.RefObject<HTMLElement | null |
  *
  * @param ref - The `ref` of the HTML Element or React Component which will enable the `droppable` functionality.
  * @param callbacks - A collection of callbacks, called by the `useDroppable` hook when a specific action occurs.
+ * @param options - The options for the `useDroppable` hook.
  */
 export declare function useDroppable(ref: React_2.RefObject<HTMLElement | null | {
     element: HTMLElement | null;
@@ -3851,7 +3888,7 @@ export declare function useDroppable(ref: React_2.RefObject<HTMLElement | null |
     onDragOver?: (event: NormalizedDragEvent) => void;
     onDragLeave?: (event: NormalizedDragEvent) => void;
     onDrop?: (event: NormalizedDragEvent) => void;
-}): void;
+}, options?: DroppableOptions): void;
 
 /** @hidden */
 export declare function useId(id?: string): any;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@progress/kendo-react-common",
-  "version": "9.5.0-develop.1",
+  "version": "9.5.0-develop.2",
   "description": "React Common package delivers common utilities that can be used with the KendoReact UI components. KendoReact Common Utilities package",
   "author": "Progress",
   "license": "SEE LICENSE IN LICENSE.md",