From cf55f3eb073979410db831d9ea309895bda64c58 Mon Sep 17 00:00:00 2001
From: Pedro Henrique Ulmi <pedroh.u@hotmail.com>
Date: Fri, 10 Nov 2023 16:56:11 -0300
Subject: [PATCH] Add accept list to sortable

---
 packages/sortable/src/components/SortableContext.tsx | 11 ++++++++++-
 packages/sortable/src/hooks/useSortable.ts           |  4 +++-
 2 files changed, 13 insertions(+), 2 deletions(-)

diff --git a/packages/sortable/src/components/SortableContext.tsx b/packages/sortable/src/components/SortableContext.tsx
index ed370e24..6d6f3331 100644
--- a/packages/sortable/src/components/SortableContext.tsx
+++ b/packages/sortable/src/components/SortableContext.tsx
@@ -7,6 +7,7 @@ import {getSortedRects, itemsEqual, normalizeDisabled} from '../utilities';
 import {rectSortingStrategy} from '../strategies';
 
 export interface Props {
+  accepts: string[];
   children: React.ReactNode;
   items: (UniqueIdentifier | {id: UniqueIdentifier})[];
   strategy?: SortingStrategy;
@@ -17,6 +18,7 @@ export interface Props {
 const ID_PREFIX = 'Sortable';
 
 interface ContextDescriptor {
+  accepts: string[];
   activeIndex: number;
   containerId: string;
   disabled: Disabled;
@@ -32,6 +34,7 @@ export const Context = React.createContext<ContextDescriptor>({
   activeIndex: -1,
   containerId: ID_PREFIX,
   disableTransforms: false,
+  accepts: [],
   items: [],
   overIndex: -1,
   useDragOverlay: false,
@@ -44,6 +47,7 @@ export const Context = React.createContext<ContextDescriptor>({
 });
 
 export function SortableContext({
+  accepts,
   children,
   id,
   items: userDefinedItems,
@@ -72,7 +76,10 @@ export function SortableContext({
   const previousItemsRef = useRef(items);
   const itemsHaveChanged = !itemsEqual(items, previousItemsRef.current);
   const disableTransforms =
-    (overIndex !== -1 && activeIndex === -1) || itemsHaveChanged;
+    (overIndex !== -1 &&
+      activeIndex === -1 &&
+      !accepts.includes(active?.data?.current?.type)) ||
+    itemsHaveChanged;
   const disabled = normalizeDisabled(disabledProp);
 
   useIsomorphicLayoutEffect(() => {
@@ -87,6 +94,7 @@ export function SortableContext({
 
   const contextValue = useMemo(
     (): ContextDescriptor => ({
+      accepts,
       activeIndex,
       containerId,
       disabled,
@@ -99,6 +107,7 @@ export function SortableContext({
     }),
     // eslint-disable-next-line react-hooks/exhaustive-deps
     [
+      accepts,
       activeIndex,
       containerId,
       disabled.draggable,
diff --git a/packages/sortable/src/hooks/useSortable.ts b/packages/sortable/src/hooks/useSortable.ts
index 6560b8a6..7565163f 100644
--- a/packages/sortable/src/hooks/useSortable.ts
+++ b/packages/sortable/src/hooks/useSortable.ts
@@ -48,6 +48,7 @@ export function useSortable({
   transition = defaultTransition,
 }: Arguments) {
   const {
+    accepts,
     items,
     containerId,
     activeIndex,
@@ -110,7 +111,8 @@ export function useSortable({
   const displaceItem =
     isSorting &&
     !disableTransforms &&
-    isValidIndex(activeIndex) &&
+    (isValidIndex(activeIndex) ||
+      accepts.includes(active?.data?.current?.type)) &&
     isValidIndex(overIndex);
   const shouldDisplaceDragSource = !useDragOverlay && isDragging;
   const dragSourceDisplacement =