minecraft-inventory 0.1.42 → 0.1.43

package/README.md

@@ -1,5 +1,7 @@
 # minecraft-inventory
 
+DEMO: https://minecraft-inventory-npm.vercel.app/
+
 A flexible, scalable React library for rendering Minecraft inventory GUIs. Designed for integration into real Minecraft clients (e.g., mineflayer bots, web clients) without using CSS `transform: scale` — all sizing is driven by CSS custom properties.
 
 ## Features

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "minecraft-inventory",
-  "version": "0.1.42",
+  "version": "0.1.43",
   "type": "module",
   "license": "MIT",
   "release": {
@@ -16,6 +16,17 @@
   "files": [
     "src"
   ],
+  "homepage": "https://mcraft.fun",
+  "keywords": [
+    "minecraft",
+    "minecraft-ui",
+    "minecraft-inventory",
+    "inventory",
+    "vanilla",
+    "react",
+    "typescript",
+    "web"
+  ],
   "devDependencies": {
     "@rsbuild/core": "^1.7.3",
     "@rsbuild/plugin-react": "^1.4.6",

package/src/components/InventoryOverlay/InventoryOverlay.tsx

@@ -1,4 +1,4 @@
-import React, { useCallback, useState } from 'react'
+import React, { useCallback, useEffect, useState } from 'react'
 import { useCloseOnWClick } from '../../hooks/useCloseOnWClick'
 import { useInventoryContext } from '../../context/InventoryContext'
 import { useScale } from '../../context/ScaleContext'
@@ -94,7 +94,7 @@ export function InventoryOverlay({
   noWatermark = false,
   onOpenSettings,
 }: InventoryOverlayProps) {
-  const { heldItem, sendAction, setHeldItem, focusedSlot, setFocusedSlot } = useInventoryContext()
+  const { heldItem, sendAction, setHeldItem, focusedSlot, setFocusedSlot, hoveredSlot, getSlot } = useInventoryContext()
   const { scale } = useScale()
   const [settingsHovered, setSettingsHovered] = useState(false)
 
@@ -136,8 +136,30 @@ export function InventoryOverlay({
     pushRecipeFrame({ item, mode, guides, guideIndex: 0 })
   }, [jeiOnGetRecipes, jeiOnGetUsages, pushRecipeFrame])
 
+  // R / U while hovering a regular inventory slot (not JEI, not recipe view)
+  useEffect(() => {
+    if (!jeiOnGetRecipes && !jeiOnGetUsages) return
+    const handler = (e: KeyboardEvent) => {
+      if (e.code !== 'KeyR' && e.code !== 'KeyU') return
+      const target = e.target as Element | null
+      const tagName = (target as { tagName?: string })?.tagName ?? ''
+      if (tagName === 'INPUT' || tagName === 'TEXTAREA' || tagName === 'SELECT' || (target as { isContentEditable?: boolean })?.isContentEditable) return
+      if (recipeNavStack.length > 0) return // RecipeInventoryView handles its own R/U
+      if (hoveredSlot === null || hoveredSlot < 0) return // JEI slots handled by JEI.tsx
+      const slot = getSlot(hoveredSlot)
+      if (!slot?.item) return
+      const item = slot.item
+      handleRecipePushFrame(
+        { type: item.type, name: item.name ?? '', displayName: item.displayName ?? item.name ?? `Item #${item.type}`, count: item.count, metadata: item.metadata },
+        e.code === 'KeyR' ? 'recipes' : 'usages',
+      )
+    }
+    window.addEventListener('keydown', handler)
+    return () => window.removeEventListener('keydown', handler)
+  }, [jeiOnGetRecipes, jeiOnGetUsages, recipeNavStack.length, hoveredSlot, getSlot, handleRecipePushFrame])
+
   // Fires for any click that isn't stopped by an interactive panel (inventory, hotbar, JEI, etc.)
-  const handleBackdropClick = useCallback((e: React.MouseEvent) => {
+  const handleBackdropClick = useCallback((e: React.MouseEvent<HTMLDivElement>) => {
     // Only handle left (drop all) and right (drop one) mouse buttons
     if (e.button !== 0 && e.button !== 2) return
     if (heldItem) {
@@ -316,6 +338,7 @@ export function InventoryOverlay({
             href="https://www.npmjs.com/package/minecraft-inventory"
             target="_blank"
             rel="noopener noreferrer"
+            onMouseDown={(e) => e.stopPropagation()}
             onClick={(e) => e.stopPropagation()}
             style={{
               position: 'absolute',
@@ -330,7 +353,7 @@ export function InventoryOverlay({
               lineHeight: 1,
             }}
           >
-            INV 0.1.42
+            INV 0.1.43
           </a>
         )}
 

package/src/components/Notes/Notes.tsx

@@ -167,6 +167,7 @@ export function Notes({
               </span>
               <button
                 type="button"
+                onMouseDown={(e) => e.stopPropagation()}
                 onClick={(e) => {
                   e.stopPropagation()
                   removeNote(note.id)
@@ -205,6 +206,7 @@ export function Notes({
             value={draft}
             rows={2}
             autoFocus
+            onMouseDown={(e) => e.stopPropagation()}
             onClick={(e) => e.stopPropagation()}
             onChange={(e) => {
               setDraft(e.target.value.replace(/[\r\n]/g, ''))
@@ -235,6 +237,7 @@ export function Notes({
           {showInput && (
             <button
               type="button"
+              onMouseDown={(e) => e.stopPropagation()}
               onClick={(e) => {
                 e.stopPropagation()
                 setShowInput(false)
@@ -257,6 +260,7 @@ export function Notes({
           )}
           <button
             type="button"
+            onMouseDown={(e) => e.stopPropagation()}
             onClick={(e) => {
               e.stopPropagation()
               handleAddButtonClick()