@rpg-engine/long-bow 0.2.50 → 0.2.52

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rpg-engine/long-bow",
-  "version": "0.2.50",
+  "version": "0.2.52",
   "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.5.74",
+    "@rpg-engine/shared": "^0.5.82",
     "dayjs": "^1.11.2",
     "fs-extra": "^10.1.0",
     "lodash": "^4.17.21",

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

@@ -18,6 +18,7 @@ export interface IItemContainerProps {
   type: ItemContainerType;
   atlasJSON: any;
   atlasIMG: any;
+  disableContextMenu?: boolean;
 }
 
 export const ItemContainer: React.FC<IItemContainerProps> = ({
@@ -29,6 +30,7 @@ export const ItemContainer: React.FC<IItemContainerProps> = ({
   type,
   atlasJSON,
   atlasIMG,
+  disableContextMenu = false,
 }) => {
   const onRenderSlots = () => {
     const slots = [];
@@ -36,6 +38,7 @@ export const ItemContainer: React.FC<IItemContainerProps> = ({
     for (let i = 0; i < itemContainer.slotQty; i++) {
       slots.push(
         <ItemSlot
+          isContextMenuDisabled={disableContextMenu}
           key={i}
           slotIndex={i}
           item={itemContainer.slots?.[i] || null}

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

@@ -54,6 +54,7 @@ interface IProps {
   ) => void;
   atlasJSON: any;
   atlasIMG: any;
+  isContextMenuDisabled?: boolean;
 }
 
 export const ItemSlot: React.FC<IProps> = observer(
@@ -68,6 +69,7 @@ export const ItemSlot: React.FC<IProps> = observer(
     onSelected,
     atlasJSON,
     atlasIMG,
+    isContextMenuDisabled = false,
   }) => {
     const [isTooltipVisible, setTooltipVisible] = useState(false);
 
@@ -207,7 +209,7 @@ export const ItemSlot: React.FC<IProps> = observer(
           }
         }}
       >
-        {isContextMenuVisible && contextActions && (
+        {!isContextMenuDisabled && isContextMenuVisible && contextActions && (
           <RelativeListMenu
             options={contextActions}
             onSelected={(optionId: string) => {

package/src/components/Item/Inventory/itemContainerHelper.ts

@@ -142,6 +142,14 @@ export const generateContextMenu = (
         );
         break;
     }
+
+    const contextActionMenuDontHaveUseWith = !contextActionMenu.find(action =>
+      action.text.toLowerCase().includes('use with')
+    );
+
+    if (item.hasUseWith && contextActionMenuDontHaveUseWith) {
+      contextActionMenu.push({ id: 'use-with', text: 'Use with...' });
+    }
   }
 
   return contextActionMenu;

package/src/components/TimeWidget/DayNightPeriod/DayNightPeriod.tsx

@@ -26,6 +26,10 @@ export const DayNightPeriod: React.FC<IPeriodOfDayDisplayProps> = ({
   );
 };
 
-const GifContainer = styled.span`
+const GifContainer = styled.div`
   width: 100%;
+
+  img {
+    width: 67%;
+  }
 `;

package/src/components/TimeWidget/TimeWidget.tsx

@@ -33,31 +33,30 @@ export const TimeWidget: React.FC<IClockWidgetProps> = ({
 
 const WidgetContainer = styled.div`
   background-image: url(${ClockWidgetImg});
+  background-size: 10rem;
   background-repeat: no-repeat;
-  width: 100%;
+  width: 10rem;
   position: absolute;
-  margin: 20px;
 `;
 
 const Time = styled.div`
-  width: 100%;
-  top: -6.95rem;
-  right: -4.4rem;
-  position: relative;
-  font-size: 7.5px;
+  top: 0.75rem;
+  right: 0.5rem;
+  position: absolute;
+  font-size: ${uiFonts.size.small};
   color: white;
 `;
 
 const CloseButton = styled.p`
-  width: 100%;
-  position: relative;
-  top: -1rem;
-  right: -6.9rem;
-  font-size: ${uiFonts.size.xxsmall} !important;
+  position: absolute;
+  top: -0.5rem;
+  margin: 0;
+  right: -0.2rem;
+  font-size: ${uiFonts.size.small} !important;
   z-index: 1;
 `;
-const DayNightContainer = styled.span`
-  top: -41px;
-  left: -3px;
-  position: relative;
+
+const DayNightContainer = styled.div`
+  margin-top: -0.3rem;
+  margin-left: -0.3rem;
 `;