@rpg-engine/long-bow 0.5.23 → 0.5.26

package/dist/components/Item/Inventory/DraggedItem.d.ts

@@ -2,6 +2,7 @@
 interface IProps {
     atlasJSON: any;
     atlasIMG: any;
+    scale?: number;
 }
-export declare const DraggedItem: ({ atlasJSON, atlasIMG, }: IProps) => JSX.Element | null;
+export declare const DraggedItem: ({ atlasJSON, atlasIMG, scale, }: IProps) => JSX.Element | null;
 export default DraggedItem;

package/dist/components/shared/ScalableContainer.d.ts

@@ -0,0 +1,7 @@
+interface IScalableContainerProps {
+    scale?: number;
+    centralize?: boolean;
+    breakPoint?: string;
+}
+export declare const ScalableContainer: import("styled-components").StyledComponent<"div", any, IScalableContainerProps, never>;
+export {};

package/dist/constants/uiBreakpoints.d.ts

@@ -0,0 +1,2 @@
+export declare const UI_BREAKPOINT_MOBILE = "950px";
+export declare const UI_BREAKPOINT_SMALL_LAPTOP = "1400px";

package/dist/hooks/useCursorPosition.d.ts

@@ -0,0 +1,6 @@
+import { IPosition } from '../types/eventTypes';
+interface ICursorPositionProps {
+    scale?: number;
+}
+export declare const useCursorPosition: ({ scale }: ICursorPositionProps) => IPosition;
+export {};

package/dist/hooks/useShortcuts.d.ts

@@ -0,0 +1,12 @@
+import { IItem, IShortcut } from '@rpg-engine/shared';
+interface IUseShortcuts {
+    itemContainer: {
+        slots: Record<number, IItem | null | undefined>;
+    };
+}
+export declare const useShortcuts: ({ itemContainer }: IUseShortcuts) => {
+    shortcuts: IShortcut[];
+    setItemShortcut: (key: string, index: number) => void;
+    removeShortcut: (index: number) => void;
+};
+export {};

package/dist/long-bow.cjs.development.js

@@ -13479,6 +13479,8 @@ var ItemSlotRenderer = function ItemSlotRenderer(_ref) {
         return renderEquipment(itemToRender);
       case shared.ItemContainerType.Inventory:
         return renderItem(itemToRender);
+      case shared.ItemContainerType.Depot:
+        return renderItem(itemToRender);
       default:
         return null;
     }
@@ -14755,49 +14757,43 @@ var Details = /*#__PURE__*/styled.p.withConfig({
   componentId: "sc-kaa0h9-0"
 })(["font-size:", " !important;"], uiFonts.size.xsmall);
 
-var useCursorPosition = function useCursorPosition() {
+var useCursorPosition = function useCursorPosition(_ref) {
+  var _ref$scale = _ref.scale,
+    scale = _ref$scale === void 0 ? 1 : _ref$scale;
   var _useState = React.useState({
       x: 0,
       y: 0
     }),
-    cursorPosition = _useState[0],
-    setCursorPosition = _useState[1];
-  React.useEffect(function () {
-    var animationFrameId;
-    var updateCursorPosition = function updateCursorPosition(x, y) {
-      // Cancel the previous frame request
-      cancelAnimationFrame(animationFrameId);
-      // Request a new frame
-      animationFrameId = requestAnimationFrame(function () {
-        setCursorPosition({
-          x: x,
-          y: y
-        });
-      });
-    };
-    var handleMouseMove = function handleMouseMove(event) {
-      updateCursorPosition(event.clientX, event.clientY);
-    };
-    var handleTouchMove = function handleTouchMove(event) {
-      // Prevent default touch behavior (like scrolling)
-      event.preventDefault();
-      if (event.touches.length > 0) {
-        var touch = event.touches[0];
-        updateCursorPosition(touch.clientX, touch.clientY);
-      }
-    };
-    window.addEventListener('mousemove', handleMouseMove);
-    window.addEventListener('touchmove', handleTouchMove, {
-      passive: false
+    position = _useState[0],
+    setPosition = _useState[1];
+  var setFromEvent = function setFromEvent(e) {
+    var x, y;
+    var viewportCenterX = window.innerWidth / 2 - shared.GRID_WIDTH;
+    var viewportCenterY = window.innerHeight / -shared.GRID_HEIGHT;
+    if ('touches' in e) {
+      x = e.touches[0].clientX;
+      y = e.touches[0].clientY;
+    } else {
+      x = e.clientX;
+      y = e.clientY;
+    }
+    // Adjusting for the global scale
+    // Assuming the element is centrally located
+    setPosition({
+      x: (x - viewportCenterX) / scale + viewportCenterX,
+      y: (y - viewportCenterY) / scale + viewportCenterY
     });
-    // Cleanup function
+  };
+  React.useEffect(function () {
+    window.addEventListener('mousemove', setFromEvent);
+    window.addEventListener('touchmove', setFromEvent);
+    console.log("SCALE IS ", scale);
     return function () {
-      window.removeEventListener('mousemove', handleMouseMove);
-      window.removeEventListener('touchmove', handleTouchMove);
-      cancelAnimationFrame(animationFrameId);
+      window.removeEventListener('mousemove', setFromEvent);
+      window.removeEventListener('touchmove', setFromEvent);
     };
-  }, []);
-  return cursorPosition;
+  }, [scale]);
+  return position;
 };
 
 var CONTAINER_SIZE = 32;
@@ -14805,10 +14801,13 @@ var OFFSET = CONTAINER_SIZE / 2;
 var DraggedItem = function DraggedItem(_ref) {
   var _item$_id, _item$stackQty;
   var atlasJSON = _ref.atlasJSON,
-    atlasIMG = _ref.atlasIMG;
+    atlasIMG = _ref.atlasIMG,
+    scale = _ref.scale;
   var _useDragging = useDragging(),
     item = _useDragging.item;
-  var _useCursorPosition = useCursorPosition(),
+  var _useCursorPosition = useCursorPosition({
+      scale: scale
+    }),
     x = _useCursorPosition.x,
     y = _useCursorPosition.y;
   if (!item) {
@@ -14929,7 +14928,8 @@ var EquipmentSet = function EquipmentSet(_ref) {
   };
   return React__default.createElement(DraggingProvider, null, React__default.createElement(DraggedItem, {
     atlasIMG: atlasIMG,
-    atlasJSON: atlasJSON
+    atlasJSON: atlasJSON,
+    scale: scale
   }), React__default.createElement(DraggableContainer, {
     title: 'Equipments',
     type: exports.RPGUIContainerTypes.Framed,
@@ -16006,7 +16006,8 @@ var ItemContainer$1 = function ItemContainer(_ref) {
   };
   return React__default.createElement(DraggingProvider, null, React__default.createElement(DraggedItem, {
     atlasIMG: atlasIMG,
-    atlasJSON: atlasJSON
+    atlasJSON: atlasJSON,
+    scale: scale
   }), React__default.createElement(SlotsContainer, {
     title: itemContainer.name || 'Container',
     onClose: onClose,