@rpg-engine/long-bow 0.7.79 → 0.7.81

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rpg-engine/long-bow",
-  "version": "0.7.79",
+  "version": "0.7.81",
   "license": "MIT",
   "main": "dist/index.js",
   "typings": "dist/index.d.ts",

package/src/components/Item/Inventory/ItemSlot.tsx

@@ -153,7 +153,7 @@ export const ItemSlot: React.FC<IProps> = observer(
 
     const {
       isContextMenuVisible,
-
+      clearDetailsState,
       clearContextActions,
     } = detailsState;
 
@@ -165,12 +165,7 @@ export const ItemSlot: React.FC<IProps> = observer(
       clearDraggingState,
     } = useItemSlotDragging();
 
-    const {
-      isFocused,
-      dropPosition,
-      isDragging,
-      draggingDistance,
-    } = draggingState;
+    const { isFocused, isDragging, draggingDistance } = draggingState;
 
     useEffect(() => {
       // Reset drag position and focus when item changes
@@ -187,18 +182,25 @@ export const ItemSlot: React.FC<IProps> = observer(
     ]);
 
     useEffect(() => {
-      // Handle outside drop
-      if (onDrop && item && dropPosition) {
-        onDrop(item, dropPosition);
-      }
-    }, [dropPosition, onDrop, item]);
+      // Reset drag position and focus when item changes
+      clearDraggingState();
+
+      // Clear context actions when component unmounts or dependencies change
+      return () => {
+        clearContextActions();
+      };
+    }, [
+      containerType,
+      isDepotSystem,
+      setContextActions,
+      clearContextActions,
+      isContextMenuDisabled,
+      updateDraggingState, // Add this dependency
+    ]);
 
     const resetItem = () => {
       clearDraggingState();
-      updateDetailsState({
-        item,
-        isTooltipVisible: false,
-      });
+      clearDetailsState();
     };
 
     const onSuccessfulDrag = (quantity?: number) => {
@@ -324,27 +326,31 @@ export const ItemSlot: React.FC<IProps> = observer(
       return { x: matrix.m41, y: matrix.m42 };
     };
 
-    /**
-     * Processes the end of a drag event, handling quantity selection or resetting state.
-     */
-    const processDragEnd = (item: IItem) => {
-      if (checkIfItemCanBeMoved?.()) {
-        if (checkIfItemShouldDragEnd && !checkIfItemShouldDragEnd()) return;
-
-        if (item.stackQty && item.stackQty !== 1 && openQuantitySelector) {
-          openQuantitySelector(item.stackQty, onSuccessfulDrag);
+    const processDragEnd = useCallback(
+      (item: IItem) => {
+        if (checkIfItemCanBeMoved?.()) {
+          if (checkIfItemShouldDragEnd && !checkIfItemShouldDragEnd()) {
+            resetItem();
+            return;
+          }
+
+          if (item.stackQty && item.stackQty !== 1 && openQuantitySelector) {
+            openQuantitySelector(item.stackQty, onSuccessfulDrag);
+          } else {
+            onSuccessfulDrag(item.stackQty);
+          }
         } else {
-          onSuccessfulDrag(item.stackQty);
+          resetItem();
         }
-      } else {
-        resetItem();
-
-        updateDraggingState({
-          isFocused: false,
-          position: { x: 0, y: 0 },
-        });
-      }
-    };
+      },
+      [
+        checkIfItemCanBeMoved,
+        checkIfItemShouldDragEnd,
+        openQuantitySelector,
+        onSuccessfulDrag,
+        resetItem,
+      ]
+    );
 
     /**
      * Handles the context menu or tooltip display after dragging stops without a drop.