minecraft-inventory 0.1.3 → 0.1.5

package/src/context/InventoryContext.tsx

@@ -1,6 +1,11 @@
-import React, { createContext, useContext, useEffect, useRef, useState, useCallback } from 'react'
+import React, { createContext, useContext, useEffect, useRef, useState, useCallback, useMemo } from 'react'
 import type { InventoryWindowState, PlayerState, ItemStack, SlotState } from '../types'
 import type { InventoryConnector } from '../connector/types'
+import { isItemEqual, getMaxStackSize } from '../utils/isItemEqual'
+
+export interface DragPreviewEntry {
+  count: number
+}
 
 export interface InventoryContextValue {
   windowState: InventoryWindowState | null
@@ -12,6 +17,8 @@ export interface InventoryContextValue {
   isDragging: boolean
   dragSlots: number[]
   dragButton: 'left' | 'right' | null
+  /** Client-side preview of item counts for each slot in the current drag */
+  dragPreview: Map<number, DragPreviewEntry>
   startDrag: (slotIndex: number, button: 'left' | 'right') => void
   addDragSlot: (slotIndex: number) => void
   endDrag: () => void
@@ -24,6 +31,17 @@ export interface InventoryContextValue {
   /** Pixel offset from the cursor item's top-left to the grab point, preserving pick-up position */
   grabOffset: { x: number; y: number }
   setGrabOffset: (offset: { x: number; y: number }) => void
+  /** Whether drag/spread operations are disabled */
+  noDragSpread: boolean
+  /** Whether P-key slot numbering mode is active */
+  pKeyActive: boolean
+  setPKeyActive: (v: boolean) => void
+  /** Currently focused slot index (via P-key number entry) */
+  focusedSlot: number | null
+  setFocusedSlot: (slot: number | null) => void
+  /** Pending first digit for P-key slot number entry */
+  pKeyDigit: string
+  setPKeyDigit: (d: string) => void
 }
 
 const InventoryContext = createContext<InventoryContextValue | null>(null)
@@ -37,9 +55,10 @@ export function useInventoryContext(): InventoryContextValue {
 interface InventoryProviderProps {
   connector: InventoryConnector | null
   children: React.ReactNode
+  noDragSpread?: boolean
 }
 
-export function InventoryProvider({ connector, children }: InventoryProviderProps) {
+export function InventoryProvider({ connector, children, noDragSpread = false }: InventoryProviderProps) {
   const [windowState, setWindowState] = useState<InventoryWindowState | null>(
     () => connector?.getWindowState() ?? null,
   )
@@ -53,12 +72,24 @@ export function InventoryProvider({ connector, children }: InventoryProviderProp
   const [isDragging, setIsDragging] = useState(false)
   const [dragSlots, setDragSlots] = useState<number[]>([])
   const [dragButton, setDragButton] = useState<'left' | 'right' | null>(null)
+  const [dragPreview, setDragPreview] = useState<Map<number, DragPreviewEntry>>(new Map())
   const [activeNumberKey, setActiveNumberKey] = useState<number | null>(null)
   const [grabOffset, setGrabOffset] = useState<{ x: number; y: number }>({ x: 0, y: 0 })
+  const [pKeyActive, setPKeyActive] = useState(false)
+  const [focusedSlot, setFocusedSlot] = useState<number | null>(null)
+  const [pKeyDigit, setPKeyDigit] = useState('')
 
   const connectorRef = useRef(connector)
   connectorRef.current = connector
 
+  // Refs so endDrag can read current values without being in its dep array
+  const heldItemRef = useRef(heldItem)
+  heldItemRef.current = heldItem
+  const windowStateRef = useRef(windowState)
+  windowStateRef.current = windowState
+  const dragButtonRef = useRef(dragButton)
+  dragButtonRef.current = dragButton
+
   useEffect(() => {
     if (!connector) return
     setWindowState(connector.getWindowState())
@@ -92,35 +123,134 @@ export function InventoryProvider({ connector, children }: InventoryProviderProp
     [],
   )
 
+  const computeDragPreview = useCallback((slots: number[], button: 'left' | 'right', held: ItemStack | null, ws: InventoryWindowState | null) => {
+    const preview = new Map<number, DragPreviewEntry>()
+    if (!held || slots.length === 0) return preview
+
+    const maxStack = getMaxStackSize(held)
+
+    if (button === 'left') {
+      // Only spread into compatible slots (empty or same item type)
+      const compatibleSlots = slots.filter((idx) => {
+        const existingItem = ws?.slots.find((s) => s.index === idx)?.item
+        return !existingItem || isItemEqual(existingItem, held)
+      })
+      if (compatibleSlots.length === 0) return preview
+      const perSlot = Math.floor(held.count / compatibleSlots.length)
+      // Vanilla behavior: if perSlot=0 (more slots than items), nothing is distributed
+      if (perSlot === 0) return preview
+      for (const idx of compatibleSlots) {
+        const existingCount = ws?.slots.find((s) => s.index === idx)?.item?.count ?? 0
+        const total = Math.min(existingCount + perSlot, maxStack)
+        preview.set(idx, { count: total })
+      }
+    } else {
+      for (const idx of slots) {
+        const existing = ws?.slots.find((s) => s.index === idx)
+        const existingItem = existing?.item
+        if (existingItem && !isItemEqual(existingItem, held)) continue
+        const existingCount = existingItem ? existingItem.count : 0
+        const total = Math.min(existingCount + 1, maxStack)
+        preview.set(idx, { count: total })
+      }
+    }
+    return preview
+  }, [])
+
   const startDrag = useCallback((slotIndex: number, button: 'left' | 'right') => {
+    if (noDragSpread) return
     setIsDragging(true)
     setDragButton(button)
     setDragSlots([slotIndex])
-    connectorRef.current?.sendAction({ type: 'drag', slots: [], button })
-  }, [])
+    setDragPreview(new Map())
+  }, [noDragSpread])
 
   const addDragSlot = useCallback((slotIndex: number) => {
     setDragSlots((prev) => {
       if (prev.includes(slotIndex)) return prev
-      return [...prev, slotIndex]
+      const next = [...prev, slotIndex]
+      setDragPreview(computeDragPreview(next, dragButton!, heldItem, windowState))
+      return next
     })
-  }, [])
+  }, [computeDragPreview, dragButton, heldItem, windowState])
 
   const endDrag = useCallback(() => {
     setDragSlots((slots) => {
-      if (slots.length > 0 && dragButton) {
-        connectorRef.current?.sendAction({ type: 'drag', slots, button: dragButton })
+      const button = dragButtonRef.current
+      const held = heldItemRef.current
+      const ws = windowStateRef.current
+
+      // Only send drag action if multiple slots were involved (single slot = normal click)
+      if (slots.length > 1 && button && held) {
+        connectorRef.current?.sendAction({ type: 'drag', slots, button })
+
+        // Optimistic client-side update: apply item distribution immediately
+        // so slots visually update before server responds.
+        const maxStack = getMaxStackSize(held)
+        const newSlots = ws ? [...ws.slots] : []
+
+        if (button === 'left') {
+          const compatibleSlots = slots.filter((idx) => {
+            const existing = newSlots.find((s) => s.index === idx)?.item
+            return !existing || isItemEqual(existing, held)
+          })
+          if (compatibleSlots.length > 0) {
+            const perSlot = Math.floor(held.count / compatibleSlots.length)
+            // Vanilla behavior: if perSlot=0 (more slots than items), nothing is distributed
+            if (perSlot > 0) {
+              let totalPlaced = 0
+              for (const idx of compatibleSlots) {
+                const existingIdx = newSlots.findIndex((s) => s.index === idx)
+                const existingCount = existingIdx >= 0 ? (newSlots[existingIdx].item?.count ?? 0) : 0
+                const add = Math.min(perSlot, maxStack - existingCount)
+                totalPlaced += add
+                const newCount = existingCount + add
+                if (existingIdx >= 0) {
+                  newSlots[existingIdx] = { index: idx, item: { ...held, count: newCount } }
+                } else {
+                  newSlots.push({ index: idx, item: { ...held, count: newCount } })
+                }
+              }
+              if (ws) setWindowState({ ...ws, slots: newSlots })
+              const remaining = held.count - totalPlaced
+              if (remaining > 0) setHeldItemState({ ...held, count: remaining })
+              else setHeldItemState(null)
+            }
+          }
+        } else {
+          // Right-click drag: place 1 per slot
+          let remaining = held.count
+          for (const idx of slots) {
+            if (remaining <= 0) break
+            const existingIdx = newSlots.findIndex((s) => s.index === idx)
+            const existingItem = existingIdx >= 0 ? newSlots[existingIdx].item : null
+            if (existingItem && !isItemEqual(existingItem, held)) continue
+            const existingCount = existingItem?.count ?? 0
+            const newCount = Math.min(existingCount + 1, maxStack)
+            if (existingIdx >= 0) {
+              newSlots[existingIdx] = { index: idx, item: { ...held, count: newCount } }
+            } else {
+              newSlots.push({ index: idx, item: { ...held, count: newCount } })
+            }
+            remaining--
+          }
+          if (ws) setWindowState({ ...ws, slots: newSlots })
+          if (remaining <= 0) setHeldItemState(null)
+          else setHeldItemState({ ...held, count: remaining })
+        }
       }
       return []
     })
     setIsDragging(false)
     setDragButton(null)
-  }, [dragButton])
+    setDragPreview(new Map())
+  }, [])
 
   const cancelDrag = useCallback(() => {
     setIsDragging(false)
     setDragSlots([])
     setDragButton(null)
+    setDragPreview(new Map())
   }, [])
 
   const getSlot = useCallback(
@@ -130,6 +260,19 @@ export function InventoryProvider({ connector, children }: InventoryProviderProp
     [windowState],
   )
 
+  // Expose state to window for easier debugging from browser DevTools.
+  // Access via: window.__mcInv
+  useEffect(() => {
+    ;(window as unknown as Record<string, unknown>).__mcInv = {
+      get windowState() { return windowStateRef.current },
+      get heldItem() { return heldItemRef.current },
+      get dragSlots() { return dragSlots },
+      get isDragging() { return isDragging },
+      get focusedSlot() { return focusedSlot },
+      get pKeyActive() { return pKeyActive },
+    }
+  })
+
   const value: InventoryContextValue = {
     windowState,
     playerState,
@@ -140,6 +283,7 @@ export function InventoryProvider({ connector, children }: InventoryProviderProp
     isDragging,
     dragSlots,
     dragButton,
+    dragPreview,
     startDrag,
     addDragSlot,
     endDrag,
@@ -151,6 +295,13 @@ export function InventoryProvider({ connector, children }: InventoryProviderProp
     getSlot,
     grabOffset,
     setGrabOffset,
+    noDragSpread,
+    pKeyActive,
+    setPKeyActive,
+    focusedSlot,
+    setFocusedSlot,
+    pKeyDigit,
+    setPKeyDigit,
   }
 
   return <InventoryContext.Provider value={value}>{children}</InventoryContext.Provider>

package/src/context/TextureContext.tsx

@@ -9,7 +9,13 @@ export const MC_GUI_BASE = MC_ASSETS_BASE
 
 export interface TextureConfig {
   baseUrl: string
-  getItemTextureUrl(item: { type: number; name?: string }): string
+  /**
+   * Resolve item texture URL.
+   * When `item.textureKey` is set it is used as the path relative to the items texture root
+   * (e.g. `"item/dye_black"` → `<base>/item/dye_black.png`).
+   * Otherwise falls back to `name` then `type`.
+   */
+  getItemTextureUrl(item: { type: number; name?: string; textureKey?: string }): string
   getBlockTextureUrl(item: { type: number; name?: string }): string
   /** Supports full mc-assets paths (e.g. "1.21.11/textures/gui/container/anvil.png") */
   getGuiTextureUrl(path: string, version?: string): string
@@ -23,8 +29,9 @@ function buildDefault(base: string): TextureConfig {
   return {
     baseUrl: base,
 
-    getItemTextureUrl({ type, name }) {
+    getItemTextureUrl({ type, name, textureKey }) {
       const root = isRemote ? MC_ITEMS_BASE : base
+      if (textureKey) return `${root}/${textureKey}.png`
       if (name) return `${root}/item/${name}.png`
       return `${root}/item/${type}.png`
     },

package/src/generated/localTextures.ts

@@ -1,5 +1,5 @@
 // Auto-generated by scripts/generate-texture-imports.mjs — do not edit manually
-// Re-run `node scripts/generate-texture-imports.mjs` after changing inventories.
+// Re-run `pnpm gen:textures` after changing inventories.
 
 import _gui_container_inventory from 'mc-assets/dist/other-textures/latest/gui/container/inventory.png'
 import _gui_container_shulker_box from 'mc-assets/dist/other-textures/latest/gui/container/shulker_box.png'
@@ -13,6 +13,7 @@ import _gui_container_anvil from 'mc-assets/dist/other-textures/latest/gui/conta
 import _gui_container_grindstone from 'mc-assets/dist/other-textures/latest/gui/container/grindstone.png'
 import _gui_container_enchanting_table from 'mc-assets/dist/other-textures/latest/gui/container/enchanting_table.png'
 import _gui_container_smithing from 'mc-assets/dist/other-textures/latest/gui/container/smithing.png'
+import _gui_container_smithing_2 from 'mc-assets/dist/other-textures/1.19.4/gui/container/smithing.png'
 import _gui_container_hopper from 'mc-assets/dist/other-textures/latest/gui/container/hopper.png'
 import _gui_container_dispenser from 'mc-assets/dist/other-textures/latest/gui/container/dispenser.png'
 import _gui_container_beacon from 'mc-assets/dist/other-textures/latest/gui/container/beacon.png'
@@ -24,15 +25,21 @@ import _gui_container_stonecutter from 'mc-assets/dist/other-textures/latest/gui
 import _gui_container_crafter from 'mc-assets/dist/other-textures/latest/gui/container/crafter.png'
 import _gui_container_creative_inventory_tab_items from 'mc-assets/dist/other-textures/latest/gui/container/creative_inventory/tab_items.png'
 import _gui_widgets from 'mc-assets/dist/other-textures/1.15/gui/widgets.png'
+import _gui_sprites_container_anvil_text_field from 'mc-assets/dist/other-textures/latest/gui/sprites/container/anvil/text_field.png'
+import _gui_sprites_container_anvil_text_field_disabled from 'mc-assets/dist/other-textures/latest/gui/sprites/container/anvil/text_field_disabled.png'
 
 /**
  * Maps each inventory type name to its texture path (version prefix stripped).
- * Useful for building custom texture resolvers or inspecting the full texture list.
  */
 export const allContainerPaths: Record<string, string> = {
   player: 'gui/container/inventory.png',
   chest: 'gui/container/shulker_box.png',
-  generic_9x1: 'gui/container/shulker_box.png',
+  generic_9x1: 'gui/container/generic_54.png',
+  generic_9x2: 'gui/container/generic_54.png',
+  generic_9x3: 'gui/container/generic_54.png',
+  generic_9x4: 'gui/container/generic_54.png',
+  generic_9x5: 'gui/container/generic_54.png',
+  generic_9x6: 'gui/container/generic_54.png',
   large_chest: 'gui/container/generic_54.png',
   crafting_table: 'gui/container/crafting_table.png',
   furnace: 'gui/container/furnace.png',
@@ -62,7 +69,7 @@ export const allContainerPaths: Record<string, string> = {
   hotbar: 'gui/widgets.png',
 }
 
-// Internal: full versioned texture path → bundled asset URL (or undefined = not found)
+// Internal: versioned texture key → bundled asset URL (or undefined → remote fallback)
 const _map: Record<string, string | undefined> = {
   '1.21.11/textures/gui/container/inventory.png': _gui_container_inventory,
   '1.21.11/textures/gui/container/shulker_box.png': _gui_container_shulker_box,
@@ -76,7 +83,7 @@ const _map: Record<string, string | undefined> = {
   '1.21.11/textures/gui/container/grindstone.png': _gui_container_grindstone,
   '1.21.11/textures/gui/container/enchanting_table.png': _gui_container_enchanting_table,
   '1.21.11/textures/gui/container/smithing.png': _gui_container_smithing,
-  '1.16.4/textures/gui/container/smithing.png': _gui_container_smithing,
+  '1.16.4/textures/gui/container/smithing.png': _gui_container_smithing_2,
   '1.21.11/textures/gui/container/hopper.png': _gui_container_hopper,
   '1.21.11/textures/gui/container/dispenser.png': _gui_container_dispenser,
   '1.21.11/textures/gui/container/beacon.png': _gui_container_beacon,
@@ -88,25 +95,27 @@ const _map: Record<string, string | undefined> = {
   '1.21.11/textures/gui/container/crafter.png': _gui_container_crafter,
   '1.21.11/textures/gui/container/creative_inventory/tab_items.png': _gui_container_creative_inventory_tab_items,
   '1.15/textures/gui/widgets.png': _gui_widgets,
+  '1.21.11/textures/gui/sprites/container/anvil/text_field.png': _gui_sprites_container_anvil_text_field,
+  '1.21.11/textures/gui/sprites/container/anvil/text_field_disabled.png': _gui_sprites_container_anvil_text_field_disabled,
 }
 
 /**
  * Partial TextureConfig that resolves inventory GUI textures from locally bundled
  * mc-assets assets instead of remote GitHub URLs.
  *
- * Pass to `<TextureProvider config={localTexturesConfig}>` to use offline/bundled assets:
+ * Pass to `<TextureProvider config={localTexturesConfig}>` to use offline/bundled assets.
  *
- * ```tsx
- * import { localTexturesConfig } from './generated/localTextures'
- * <TextureProvider config={localTexturesConfig}>
- *   <InventoryOverlay type="chest" ... />
- * </TextureProvider>
- * ```
+ * Unknown paths (not bundled) fall back to the mc-assets remote URL automatically.
  */
+const _MC_ASSETS_REMOTE = "https://raw.githubusercontent.com/zardoy/mc-assets/refs/heads/gh-pages"
 export const localTexturesConfig = {
   getGuiTextureUrl(path: string): string {
-    // _map keys are the full versioned paths used in inventories.ts
-    // e.g. '1.21.11/textures/gui/container/anvil.png'
-    return (_map[path] as string | undefined) ?? path
+    const local = _map[path] as string | undefined
+    if (local) return local
+    // Fall back to remote mc-assets URL for paths not in the bundle
+    if (path.endsWith('.png') && path.includes('/textures/')) {
+      return `${_MC_ASSETS_REMOTE}/${path}`
+    }
+    return path
   },
 }

package/src/hooks/useKeyboardShortcuts.ts

@@ -1,15 +1,70 @@
-import { useEffect } from 'react'
+import { useEffect, useCallback, useRef } from 'react'
 import { useInventoryContext } from '../context/InventoryContext'
 
 export function useKeyboardShortcuts(enabled = true) {
-  const { setActiveNumberKey, hoveredSlot, sendAction } = useInventoryContext()
+  const {
+    setActiveNumberKey,
+    hoveredSlot,
+    sendAction,
+    pKeyActive,
+    setPKeyActive,
+    focusedSlot,
+    setFocusedSlot,
+    pKeyDigit,
+    setPKeyDigit,
+  } = useInventoryContext()
+
+  const pKeyDigitRef = useRef(pKeyDigit)
+  pKeyDigitRef.current = pKeyDigit
 
   useEffect(() => {
     if (!enabled) return
 
     const handleKeyDown = (e: KeyboardEvent) => {
-      // Digit1–Digit9 → hotbar swap (works regardless of keyboard layout)
-      if (e.code >= 'Digit1' && e.code <= 'Digit9') {
+      // Ignore when typing in inputs
+      if ((e.target as HTMLElement)?.tagName === 'INPUT' || (e.target as HTMLElement)?.tagName === 'TEXTAREA') return
+
+      // P toggles slot numbering mode
+      if (e.code === 'KeyP' && !e.shiftKey && !e.ctrlKey && !e.metaKey) {
+        if (pKeyActive) {
+          setPKeyActive(false)
+          setFocusedSlot(null)
+          setPKeyDigit('')
+        } else {
+          setPKeyActive(true)
+          setPKeyDigit('')
+        }
+        return
+      }
+
+      // Escape exits P-key mode
+      if (e.code === 'Escape' && pKeyActive) {
+        setPKeyActive(false)
+        setFocusedSlot(null)
+        setPKeyDigit('')
+        return
+      }
+
+      // Number entry during P-key mode
+      if (pKeyActive && e.code >= 'Digit0' && e.code <= 'Digit9') {
+        const digit = e.code.replace('Digit', '')
+        const current = pKeyDigitRef.current
+        if (current.length === 0) {
+          setPKeyDigit(digit)
+        } else {
+          const slotNum = parseInt(current + digit, 10)
+          setPKeyDigit('')
+          if (slotNum <= 99) {
+            setFocusedSlot(slotNum)
+            // Exit P mode but keep focused slot
+            setPKeyActive(false)
+          }
+        }
+        return
+      }
+
+      // Normal hotbar number keys (only when P-key not active)
+      if (!pKeyActive && e.code >= 'Digit1' && e.code <= 'Digit9') {
         setActiveNumberKey(parseInt(e.code.replace('Digit', ''), 10) - 1)
       }
 
@@ -26,7 +81,7 @@ export function useKeyboardShortcuts(enabled = true) {
     }
 
     const handleKeyUp = (e: KeyboardEvent) => {
-      if (e.code >= 'Digit1' && e.code <= 'Digit9') {
+      if (!pKeyActive && e.code >= 'Digit1' && e.code <= 'Digit9') {
         setActiveNumberKey(null)
       }
     }
@@ -37,5 +92,5 @@ export function useKeyboardShortcuts(enabled = true) {
       window.removeEventListener('keydown', handleKeyDown)
       window.removeEventListener('keyup', handleKeyUp)
     }
-  }, [enabled, hoveredSlot, sendAction, setActiveNumberKey])
+  }, [enabled, hoveredSlot, sendAction, setActiveNumberKey, pKeyActive, setPKeyActive, focusedSlot, setFocusedSlot, setPKeyDigit])
 }

package/src/index.tsx

@@ -34,6 +34,9 @@ export type { MountedInventory } from './mount'
 export { useMobile } from './hooks/useMobile'
 export { useKeyboardShortcuts } from './hooks/useKeyboardShortcuts'
 
+// Utilities
+export { isItemEqual, getMaxStackSize } from './utils/isItemEqual'
+
 // Connector
 export { createMineflayerConnector } from './connector/mineflayer'
 export { createDemoConnector } from './connector/demo'
@@ -46,7 +49,7 @@ export type {
 export type { ActionLogEntry, DemoConnectorOptions } from './connector/demo'
 
 // Registry
-export { registerInventoryType, getInventoryType, getAllInventoryTypes } from './registry'
+export { registerInventoryType, registerTypeAlias, getInventoryType, getAllInventoryTypes } from './registry'
 export type { InventoryTypeDefinition, WindowType } from './registry'
 
 // Types
@@ -63,4 +66,5 @@ export type {
   ClickMode,
   RecipeGuide,
   RecipeNavFrame,
+  EntityDisplayArea,
 } from './types'

package/src/registry/index.ts

@@ -5,12 +5,41 @@ const registry = new Map<string, InventoryTypeDefinition>(
   Object.entries(inventoryDefinitions),
 )
 
+/**
+ * Maps alternative names/aliases to canonical inventory type names.
+ * Both the alias and the canonical name resolve to the same definition.
+ *
+ * Add entries here to support shorthand or legacy type identifiers.
+ */
+const typeAliases: Record<string, string> = {
+  // Shorthand aliases
+  crafting3x3: 'crafting_table',
+  crafting: 'crafting_table',
+  chest: 'chest',               // already canonical, listed for clarity
+  // Protocol-level minecraft: prefix stripping is handled in getInventoryType
+}
+
 export function registerInventoryType(def: InventoryTypeDefinition): void {
   registry.set(def.name, def)
 }
 
+/**
+ * Resolve an inventory type name or alias to its definition.
+ * Handles:
+ *  - Exact matches (e.g. "crafting_table")
+ *  - Aliases defined in `typeAliases` (e.g. "crafting3x3" → "crafting_table")
+ *  - "minecraft:" namespace prefix (e.g. "minecraft:generic_9x3" → "generic_9x3")
+ */
 export function getInventoryType(name: string): InventoryTypeDefinition | undefined {
-  return registry.get(name)
+  // Strip "minecraft:" namespace prefix if present
+  const stripped = name.startsWith('minecraft:') ? name.slice('minecraft:'.length) : name
+  // Resolve alias if defined
+  const canonical = typeAliases[stripped] ?? stripped
+  return registry.get(canonical)
+}
+
+export function registerTypeAlias(alias: string, canonical: string): void {
+  typeAliases[alias] = canonical
 }
 
 export function getAllInventoryTypes(): InventoryTypeDefinition[] {