@rpg-engine/long-bow 0.2.79 → 0.2.80

package/dist/mocks/equipmentSet.mocks.d.ts

@@ -1,3 +1,16 @@
-import { IEquipmentSet } from '@rpg-engine/shared';
-export declare const items: any;
+import { IEquipmentSet, IItem } from '@rpg-engine/shared';
+interface IEquipmentSetItems {
+    leftHand: IItem;
+    head: IItem;
+    armor: IItem;
+    legs: IItem;
+    boot: IItem;
+    neck: IItem;
+    ring: IItem;
+    accessory: IItem;
+    inventory: IItem;
+    rightHand: IItem;
+}
+export declare const items: IEquipmentSetItems;
 export declare const equipmentSetMock: IEquipmentSet;
+export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rpg-engine/long-bow",
-  "version": "0.2.79",
+  "version": "0.2.80",
   "license": "MIT",
   "main": "dist/index.js",
   "typings": "dist/index.d.ts",
@@ -83,7 +83,7 @@
   },
   "dependencies": {
     "@rollup/plugin-image": "^2.1.1",
-    "@rpg-engine/shared": "^0.6.37",
+    "@rpg-engine/shared": "^0.6.40",
     "dayjs": "^1.11.2",
     "fs-extra": "^10.1.0",
     "is-mobile": "^3.1.1",

package/src/components/CraftBook/MockItems.ts

@@ -2,42 +2,42 @@ import { ICraftableItem } from '@rpg-engine/shared';
 
 export const craftableItems: ICraftableItem[] = [
   {
+    key: 'bandana',
+    name: 'Bandana',
     canCraft: true,
-    key: 'frost-double-axe',
-    texturePath: 'axes/frost-double-axe.png',
-    name: 'Frost Double Axe',
-    ingredients: [
-      {
-        key: 'blue-sapphire',
-        qty: 10,
-        texturePath: 'crafting-resources/blue-sapphire.png',
-      },
+    texturePath: 'accessories/bandana.png',
+    ingredients: [ {
+      key: "leather",
+      name: "leather",
+      qty: 10,
+      texturePath: "crafting-resources/leather.png",
+    }     
     ],
   },
   {
-    key: 'frost-double-axe',
+    key: 'bandana',
+    name: 'Bandana',
     canCraft: true,
-    texturePath: 'axes/frost-double-axe.png',
-    name: 'Frost Double Axe',
-    ingredients: [
-      {
-        key: 'blue-sapphire',
-        texturePath: 'crafting-resources/blue-sapphire.png',
-        qty: 10,
-      },
+    texturePath: 'accessories/bandana.png',
+    ingredients: [ {
+      key: "leather",
+      name: "leather",
+      qty: 10,
+      texturePath: "crafting-resources/leather.png",
+    }     
     ],
   },
   {
-    key: 'frost-double-axe',
-    canCraft: false,
-    texturePath: 'axes/frost-double-axe.png',
-    name: 'Frost Double Axe',
-    ingredients: [
-      {
-        key: 'blue-sapphire',
-        texturePath: 'crafting-resources/blue-sapphire.png',
-        qty: 10,
-      },
+    key: 'bandana',
+    name: 'Bandana',
+    canCraft: true,
+    texturePath: 'accessories/bandana.png',
+    ingredients: [ {
+      key: "leather",
+      name: "leather",
+      qty: 10,
+      texturePath: "crafting-resources/leather.png",
+    }     
     ],
   },
 ];

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

@@ -4,7 +4,7 @@ import {
   IItemContainer,
   ItemContainerType,
   ItemSlotType,
-  ItemType,
+  ItemType
 } from '@rpg-engine/shared';
 
 import { observer } from 'mobx-react-lite';
@@ -112,6 +112,7 @@ export const ItemSlot: React.FC<IProps> = observer(
 
     const renderItem = (itemToRender: IItem | null) => {
       const element = [];
+ 
       if (itemToRender?.texturePath) {
         element.push(
           <ErrorBoundary key={itemToRender._id}>
@@ -119,7 +120,14 @@ export const ItemSlot: React.FC<IProps> = observer(
               key={itemToRender._id}
               atlasIMG={atlasIMG}
               atlasJSON={atlasJSON}
-              spriteKey={getItemTextureKeyPath(itemToRender, atlasJSON)}
+              spriteKey={getItemTextureKeyPath(
+                {
+                  key: itemToRender.texturePath,
+                  texturePath: itemToRender.texturePath,
+                  stackQty: itemToRender.stackQty || 1,
+                },
+                atlasJSON
+              )}
               imgScale={3}
             />
           </ErrorBoundary>
@@ -142,13 +150,21 @@ export const ItemSlot: React.FC<IProps> = observer(
         itemToRender.allowedEquipSlotType?.includes(slotSpriteMask!)
       ) {
         const element = [];
+     
         element.push(
           <ErrorBoundary key={itemToRender._id}>
             <SpriteFromAtlas
               key={itemToRender._id}
               atlasIMG={atlasIMG}
               atlasJSON={atlasJSON}
-              spriteKey={getItemTextureKeyPath(itemToRender, atlasJSON)}
+              spriteKey={getItemTextureKeyPath(
+                {
+                  key: itemToRender.texturePath,
+                  texturePath: itemToRender.texturePath,
+                  stackQty: itemToRender.stackQty || 1,
+                },
+                atlasJSON
+              )}
               imgScale={3}
             />
           </ErrorBoundary>

package/src/components/shared/SpriteFromAtlas.tsx

@@ -1,7 +1,6 @@
 import { GRID_HEIGHT, GRID_WIDTH } from '@rpg-engine/shared';
 import React from 'react';
 import styled from 'styled-components';
-import { ErrorBoundary } from '../Item/Inventory/ErrorBoundary';
 
 interface IProps {
   atlasJSON: any;
@@ -39,25 +38,23 @@ export const SpriteFromAtlas: React.FC<IProps> = ({
   if (!spriteData) throw new Error(`Sprite ${spriteKey} not found in atlas!`);
 
   return (
-    <ErrorBoundary>
-      <Container
-        width={width}
-        height={height}
-        hasHover={grayScale}
-        onClick={onClick}
-        style={containerStyle}
-      >
-        <ImgSprite
-          className="sprite-from-atlas-img"
-          atlasIMG={atlasIMG}
-          frame={spriteData.frame}
-          scale={imgScale}
-          grayScale={grayScale}
-          opacity={opacity}
-          style={imgStyle}
-        />
-      </Container>
-    </ErrorBoundary>
+    <Container
+      width={width}
+      height={height}
+      hasHover={grayScale}
+      onClick={onClick}
+      style={containerStyle}
+    >
+      <ImgSprite
+        className="sprite-from-atlas-img"
+        atlasIMG={atlasIMG}
+        frame={spriteData.frame}
+        scale={imgScale}
+        grayScale={grayScale}
+        opacity={opacity}
+        style={imgStyle}
+      />
+    </Container>
   );
 };