@rpg-engine/long-bow 0.5.22 → 0.5.24

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

@@ -0,0 +1,12 @@
+import React from 'react';
+export interface IQuantitySelect {
+    isOpen: boolean;
+    maxQuantity: number;
+    callback: (_quantity: number) => void;
+}
+interface IProps {
+    quantitySelect: IQuantitySelect;
+    setQuantitySelect: React.Dispatch<React.SetStateAction<IQuantitySelect>>;
+}
+export declare const ItemQuantitySelectorModal: ({ quantitySelect, setQuantitySelect, }: IProps) => JSX.Element;
+export {};

package/dist/hooks/useCursorPosition.d.ts

@@ -0,0 +1,6 @@
+declare type CursorPosition = {
+    x: number;
+    y: number;
+};
+export declare const useCursorPosition: () => CursorPosition;
+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;
     }
@@ -14760,44 +14762,30 @@ var useCursorPosition = function useCursorPosition() {
       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
-        });
+    position = _useState[0],
+    setPosition = _useState[1];
+  var setFromEvent = function setFromEvent(e) {
+    if ('touches' in e) {
+      setPosition({
+        x: e.touches[0].clientX,
+        y: e.touches[0].clientY
       });
-    };
-    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
-    });
-    // Cleanup function
+    } else {
+      setPosition({
+        x: e.clientX,
+        y: e.clientY
+      });
+    }
+  };
+  React.useEffect(function () {
+    window.addEventListener('mousemove', setFromEvent);
+    window.addEventListener('touchmove', setFromEvent);
     return function () {
-      window.removeEventListener('mousemove', handleMouseMove);
-      window.removeEventListener('touchmove', handleTouchMove);
-      cancelAnimationFrame(animationFrameId);
+      window.removeEventListener('mousemove', setFromEvent);
+      window.removeEventListener('touchmove', setFromEvent);
     };
   }, []);
-  return cursorPosition;
+  return position;
 };
 
 var CONTAINER_SIZE = 32;
@@ -15644,6 +15632,89 @@ var SlotsContainer = function SlotsContainer(_ref) {
   }, children);
 };
 
+var ShortcutsSetter = function ShortcutsSetter(_ref) {
+  var setSettingShortcutIndex = _ref.setSettingShortcutIndex,
+    settingShortcutIndex = _ref.settingShortcutIndex,
+    shortcuts = _ref.shortcuts,
+    removeShortcut = _ref.removeShortcut,
+    atlasJSON = _ref.atlasJSON,
+    atlasIMG = _ref.atlasIMG;
+  var getContent = function getContent(index) {
+    var _shortcuts$index;
+    if (((_shortcuts$index = shortcuts[index]) == null ? void 0 : _shortcuts$index.type) === shared.ShortcutType.Item) {
+      var _shortcuts$index2;
+      var payload = (_shortcuts$index2 = shortcuts[index]) == null ? void 0 : _shortcuts$index2.payload;
+      if (!payload) return null;
+      return React__default.createElement(SpriteFromAtlas, {
+        atlasIMG: atlasIMG,
+        atlasJSON: atlasJSON,
+        spriteKey: shared.getItemTextureKeyPath({
+          key: payload.texturePath,
+          texturePath: payload.texturePath,
+          stackQty: payload.stackQty || 1,
+          isStackable: payload.isStackable
+        }, atlasJSON),
+        width: 32,
+        height: 32,
+        imgScale: 1.2,
+        imgStyle: {
+          left: '3px'
+        }
+      });
+    }
+    var IMAGE_SIZE = 32;
+    var IMAGE_SCALE = 1;
+    var shortcut = shortcuts[index];
+    if ((shortcut == null ? void 0 : shortcut.type) === shared.ShortcutType.Spell && shortcut.payload) {
+      var _payload$texturePath;
+      var _payload = shortcut.payload; // TypeScript type assertion
+      return React__default.createElement(SpriteFromAtlas, {
+        atlasIMG: _payload.atlasIMG,
+        atlasJSON: _payload.atlasJSON,
+        spriteKey: (_payload$texturePath = _payload.texturePath) != null ? _payload$texturePath : '',
+        width: IMAGE_SIZE,
+        height: IMAGE_SIZE,
+        imgScale: IMAGE_SCALE,
+        centered: true,
+        borderRadius: "50%"
+      });
+    }
+    return null;
+  };
+  return React__default.createElement(Container$j, null, React__default.createElement("p", null, "Shortcuts:"), React__default.createElement(List, {
+    id: "shortcuts_list"
+  }, Array.from({
+    length: 12
+  }).map(function (_, i) {
+    return React__default.createElement(Shortcut, {
+      key: i,
+      onPointerDown: function onPointerDown() {
+        if (settingShortcutIndex !== -1) setSettingShortcutIndex(-1);
+        removeShortcut(i);
+        if (settingShortcutIndex === -1 && (!shortcuts[i] || shortcuts[i].type === shared.ShortcutType.None)) setSettingShortcutIndex(i);
+      },
+      disabled: settingShortcutIndex !== -1 && settingShortcutIndex !== i,
+      isBeingSet: settingShortcutIndex === i,
+      id: "shortcutSetter_" + i
+    }, getContent(i));
+  })));
+};
+var Container$j = /*#__PURE__*/styled.div.withConfig({
+  displayName: "ShortcutsSetter__Container",
+  componentId: "sc-xuouuf-0"
+})(["p{margin:0;margin-left:0.5rem;font-size:10px;}width:100%;"]);
+var Shortcut = /*#__PURE__*/styled.button.withConfig({
+  displayName: "ShortcutsSetter__Shortcut",
+  componentId: "sc-xuouuf-1"
+})(["width:2.4rem;height:2.4rem;background-color:", ";border:2px solid ", ";border-radius:50%;text-transform:uppercase;font-size:0.7rem;font-weight:bold;display:flex;align-items:center;justify-content:center;span{margin-top:4px;}&:hover,&:focus{background-color:", ";}&:active{background-color:", ";}&:disabled{opacity:0.5;}"], uiColors.lightGray, function (_ref2) {
+  var isBeingSet = _ref2.isBeingSet;
+  return isBeingSet ? uiColors.yellow : uiColors.darkGray;
+}, uiColors.darkGray, uiColors.gray);
+var List = /*#__PURE__*/styled.div.withConfig({
+  displayName: "ShortcutsSetter__List",
+  componentId: "sc-xuouuf-2"
+})(["width:100%;display:flex;align-items:center;gap:0.4rem;box-sizing:border-box;margin:0 !important;flex-wrap:wrap;padding:0.3rem;padding-bottom:1rem;"]);
+
 (function (RangeSliderType) {
   RangeSliderType["Slider"] = "rpgui-slider";
   RangeSliderType["GoldSlider"] = "rpgui-slider golden";
@@ -15798,88 +15869,33 @@ var CloseButton$3 = /*#__PURE__*/styled.div.withConfig({
   componentId: "sc-yfdtpn-3"
 })(["position:absolute;top:3px;right:0px;color:white;z-index:22;font-size:0.8rem;"]);
 
-var ShortcutsSetter = function ShortcutsSetter(_ref) {
-  var setSettingShortcutIndex = _ref.setSettingShortcutIndex,
-    settingShortcutIndex = _ref.settingShortcutIndex,
-    shortcuts = _ref.shortcuts,
-    removeShortcut = _ref.removeShortcut,
-    atlasJSON = _ref.atlasJSON,
-    atlasIMG = _ref.atlasIMG;
-  var getContent = function getContent(index) {
-    var _shortcuts$index;
-    if (((_shortcuts$index = shortcuts[index]) == null ? void 0 : _shortcuts$index.type) === shared.ShortcutType.Item) {
-      var _shortcuts$index2;
-      var payload = (_shortcuts$index2 = shortcuts[index]) == null ? void 0 : _shortcuts$index2.payload;
-      if (!payload) return null;
-      return React__default.createElement(SpriteFromAtlas, {
-        atlasIMG: atlasIMG,
-        atlasJSON: atlasJSON,
-        spriteKey: shared.getItemTextureKeyPath({
-          key: payload.texturePath,
-          texturePath: payload.texturePath,
-          stackQty: payload.stackQty || 1,
-          isStackable: payload.isStackable
-        }, atlasJSON),
-        width: 32,
-        height: 32,
-        imgScale: 1.2,
-        imgStyle: {
-          left: '3px'
-        }
+var ItemQuantitySelectorModal = function ItemQuantitySelectorModal(_ref) {
+  var quantitySelect = _ref.quantitySelect,
+    setQuantitySelect = _ref.setQuantitySelect;
+  return React__default.createElement(ModalPortal, null, React__default.createElement(QuantitySelectorContainer, null, React__default.createElement(ItemQuantitySelector, {
+    quantity: quantitySelect.maxQuantity,
+    onConfirm: function onConfirm(quantity) {
+      quantitySelect.callback(quantity);
+      setQuantitySelect({
+        isOpen: false,
+        maxQuantity: 1,
+        callback: function callback() {}
       });
-    }
-    var IMAGE_SIZE = 32;
-    var IMAGE_SCALE = 1;
-    var shortcut = shortcuts[index];
-    if ((shortcut == null ? void 0 : shortcut.type) === shared.ShortcutType.Spell && shortcut.payload) {
-      var _payload$texturePath;
-      var _payload = shortcut.payload; // TypeScript type assertion
-      return React__default.createElement(SpriteFromAtlas, {
-        atlasIMG: _payload.atlasIMG,
-        atlasJSON: _payload.atlasJSON,
-        spriteKey: (_payload$texturePath = _payload.texturePath) != null ? _payload$texturePath : '',
-        width: IMAGE_SIZE,
-        height: IMAGE_SIZE,
-        imgScale: IMAGE_SCALE,
-        centered: true,
-        borderRadius: "50%"
+    },
+    onClose: function onClose() {
+      quantitySelect.callback(-1);
+      setQuantitySelect({
+        isOpen: false,
+        maxQuantity: 1,
+        callback: function callback() {}
       });
     }
-    return null;
-  };
-  return React__default.createElement(Container$j, null, React__default.createElement("p", null, "Shortcuts:"), React__default.createElement(List, {
-    id: "shortcuts_list"
-  }, Array.from({
-    length: 12
-  }).map(function (_, i) {
-    return React__default.createElement(Shortcut, {
-      key: i,
-      onPointerDown: function onPointerDown() {
-        if (settingShortcutIndex !== -1) setSettingShortcutIndex(-1);
-        removeShortcut(i);
-        if (settingShortcutIndex === -1 && (!shortcuts[i] || shortcuts[i].type === shared.ShortcutType.None)) setSettingShortcutIndex(i);
-      },
-      disabled: settingShortcutIndex !== -1 && settingShortcutIndex !== i,
-      isBeingSet: settingShortcutIndex === i,
-      id: "shortcutSetter_" + i
-    }, getContent(i));
   })));
 };
-var Container$j = /*#__PURE__*/styled.div.withConfig({
-  displayName: "ShortcutsSetter__Container",
-  componentId: "sc-xuouuf-0"
-})(["p{margin:0;margin-left:0.5rem;font-size:10px;}width:100%;"]);
-var Shortcut = /*#__PURE__*/styled.button.withConfig({
-  displayName: "ShortcutsSetter__Shortcut",
-  componentId: "sc-xuouuf-1"
-})(["width:2.4rem;height:2.4rem;background-color:", ";border:2px solid ", ";border-radius:50%;text-transform:uppercase;font-size:0.7rem;font-weight:bold;display:flex;align-items:center;justify-content:center;span{margin-top:4px;}&:hover,&:focus{background-color:", ";}&:active{background-color:", ";}&:disabled{opacity:0.5;}"], uiColors.lightGray, function (_ref2) {
-  var isBeingSet = _ref2.isBeingSet;
-  return isBeingSet ? uiColors.yellow : uiColors.darkGray;
-}, uiColors.darkGray, uiColors.gray);
-var List = /*#__PURE__*/styled.div.withConfig({
-  displayName: "ShortcutsSetter__List",
-  componentId: "sc-xuouuf-2"
-})(["width:100%;display:flex;align-items:center;gap:0.4rem;box-sizing:border-box;margin:0 !important;flex-wrap:wrap;padding:0.3rem;padding-bottom:1rem;"]);
+var QuantitySelectorContainer = /*#__PURE__*/styled.div.withConfig({
+  displayName: "ItemQuantitySelectorModal__QuantitySelectorContainer",
+  componentId: "sc-1b8cosc-0"
+})(["position:absolute;top:0;left:0;width:100vw;height:100vh;z-index:100;display:flex;justify-content:center;align-items:center;background-color:rgba(0,0,0,0.5);"]);
 
 var ItemContainer$1 = function ItemContainer(_ref) {
   var itemContainer = _ref.itemContainer,
@@ -15995,34 +16011,15 @@ var ItemContainer$1 = function ItemContainer(_ref) {
     atlasJSON: atlasJSON
   }), React__default.createElement(ItemsContainer, {
     className: "item-container-body"
-  }, onRenderSlots())), quantitySelect.isOpen && React__default.createElement(ModalPortal, null, React__default.createElement(QuantitySelectorContainer, null, React__default.createElement(ItemQuantitySelector, {
-    quantity: quantitySelect.maxQuantity,
-    onConfirm: function onConfirm(quantity) {
-      quantitySelect.callback(quantity);
-      setQuantitySelect({
-        isOpen: false,
-        maxQuantity: 1,
-        callback: function callback() {}
-      });
-    },
-    onClose: function onClose() {
-      quantitySelect.callback(-1);
-      setQuantitySelect({
-        isOpen: false,
-        maxQuantity: 1,
-        callback: function callback() {}
-      });
-    }
-  }))));
+  }, onRenderSlots())), quantitySelect.isOpen && React__default.createElement(ItemQuantitySelectorModal, {
+    quantitySelect: quantitySelect,
+    setQuantitySelect: setQuantitySelect
+  }));
 };
 var ItemsContainer = /*#__PURE__*/styled.div.withConfig({
   displayName: "ItemContainer__ItemsContainer",
   componentId: "sc-15y5p9l-0"
 })(["display:flex;justify-content:center;flex-wrap:wrap;max-height:270px;overflow-y:auto;overflow-x:hidden;width:415px;"]);
-var QuantitySelectorContainer = /*#__PURE__*/styled.div.withConfig({
-  displayName: "ItemContainer__QuantitySelectorContainer",
-  componentId: "sc-15y5p9l-1"
-})(["position:absolute;top:0;left:0;width:100vw;height:100vh;z-index:100;display:flex;justify-content:center;align-items:center;background-color:rgba(0,0,0,0.5);"]);
 
 var LeaderboardTable = function LeaderboardTable(props) {
   var items = props.items,