minecraft-inventory 0.1.0

package/src/registry/inventories.ts

@@ -0,0 +1,612 @@
+import type { InventoryTypeDefinition } from '../types'
+
+const SLOT_SIZE = 18
+
+function playerInv(
+  yOffset: number,
+  invStartIndex = 9,
+  hotbarStartIndex = 36,
+): InventoryTypeDefinition['slots'] {
+  const slots: InventoryTypeDefinition['slots'] = []
+  for (let row = 0; row < 3; row++) {
+    for (let col = 0; col < 9; col++) {
+      slots.push({
+        index: invStartIndex + row * 9 + col,
+        x: 8 + col * SLOT_SIZE,
+        y: yOffset + row * SLOT_SIZE,
+        group: 'inventory',
+      })
+    }
+  }
+  for (let col = 0; col < 9; col++) {
+    slots.push({
+      index: hotbarStartIndex + col,
+      x: 8 + col * SLOT_SIZE,
+      y: yOffset + 58,
+      group: 'hotbar',
+    })
+  }
+  return slots
+}
+
+function hotbarSlots(yOffset: number, indexOffset = 36, xOffset = 8): InventoryTypeDefinition['slots'] {
+  return Array.from({ length: 9 }, (_, col) => ({
+    index: indexOffset + col,
+    x: xOffset + col * SLOT_SIZE,
+    y: yOffset,
+    group: 'hotbar',
+  }))
+}
+
+function gridSlots(
+  startIndex: number,
+  cols: number,
+  rows: number,
+  x: number,
+  y: number,
+  group: string,
+): InventoryTypeDefinition['slots'] {
+  const slots: InventoryTypeDefinition['slots'] = []
+  for (let row = 0; row < rows; row++) {
+    for (let col = 0; col < cols; col++) {
+      slots.push({
+        index: startIndex + row * cols + col,
+        x: x + col * SLOT_SIZE,
+        y: y + row * SLOT_SIZE,
+        group,
+      })
+    }
+  }
+  return slots
+}
+
+export const inventoryDefinitions: Record<string, InventoryTypeDefinition> = {
+  player: {
+    name: 'player',
+    title: 'Inventory',
+    backgroundTexture: 'gui/container/inventory',
+    backgroundWidth: 176,
+    backgroundHeight: 166,
+    slots: [
+      // Result
+      { index: 0, x: 154, y: 28, group: 'result', resultSlot: true },
+      // Crafting 2x2
+      ...gridSlots(1, 2, 2, 98, 18, 'crafting'),
+      // Armor (head to feet = slots 5-8)
+      { index: 5, x: 8, y: 8, group: 'armor', label: 'Head' },
+      { index: 6, x: 8, y: 26, group: 'armor', label: 'Chest' },
+      { index: 7, x: 8, y: 44, group: 'armor', label: 'Legs' },
+      { index: 8, x: 8, y: 62, group: 'armor', label: 'Feet' },
+      // Offhand
+      { index: 45, x: 77, y: 62, group: 'offhand', label: 'Offhand' },
+      // Player inventory 9-35, hotbar 36-44
+      ...playerInv(84, 9, 36),
+    ],
+  },
+
+  chest: {
+    name: 'chest',
+    title: 'Chest',
+    backgroundTexture: 'gui/container/shulker_box',
+    backgroundWidth: 176,
+    backgroundHeight: 166,
+    playerInventoryOffset: { x: 8, y: 84 },
+    slots: [
+      ...gridSlots(0, 9, 3, 8, 18, 'container'),
+      // player inv: 27-53, hotbar: 54-62
+      ...playerInv(84, 27, 54),
+    ],
+  },
+
+  generic_9x1: {
+    name: 'generic_9x1',
+    title: 'Container',
+    backgroundTexture: 'gui/container/shulker_box',
+    backgroundWidth: 176,
+    backgroundHeight: 96,
+    slots: [
+      ...gridSlots(0, 9, 1, 8, 18, 'container'),
+      // inv: 9-35, hotbar: 36-44
+      ...playerInv(14, 9, 36),
+    ],
+  },
+
+  large_chest: {
+    name: 'large_chest',
+    title: 'Large Chest',
+    backgroundTexture: 'gui/container/generic_54',
+    backgroundWidth: 176,
+    backgroundHeight: 222,
+    playerInventoryOffset: { x: 8, y: 140 },
+    slots: [
+      ...gridSlots(0, 9, 6, 8, 18, 'container'),
+      // player inv: 54-80, hotbar: 81-89
+      ...playerInv(140, 54, 81),
+    ],
+  },
+
+  crafting_table: {
+    name: 'crafting_table',
+    title: 'Crafting',
+    backgroundTexture: 'gui/container/crafting_table',
+    backgroundWidth: 176,
+    backgroundHeight: 166,
+    slots: [
+      { index: 0, x: 124, y: 35, group: 'result', resultSlot: true },
+      ...gridSlots(1, 3, 3, 30, 17, 'crafting'),
+      // inv: 10-36, hotbar: 37-45
+      ...playerInv(84, 10, 37),
+    ],
+  },
+
+  furnace: {
+    name: 'furnace',
+    title: 'Furnace',
+    backgroundTexture: 'gui/container/furnace',
+    backgroundWidth: 176,
+    backgroundHeight: 166,
+    properties: {
+      litTime: { dataSlot: 0, description: 'Fuel burn time remaining' },
+      litDuration: { dataSlot: 1, description: 'Max fuel burn time' },
+      cookingProgress: { dataSlot: 2, description: 'Cook progress (0-200)' },
+      totalCookTime: { dataSlot: 3, description: 'Total cook time' },
+    },
+    progressBars: [
+      {
+        id: 'fire',
+        x: 56, y: 36, width: 14, height: 14,
+        direction: 'up',
+        textureX: 176, textureY: 0,
+        emptyTextureX: 176, emptyTextureY: 12,
+        getValue: (p) => p.litTime ?? 0,
+        getMax: (p) => p.litDuration || 200,
+      },
+      {
+        id: 'arrow',
+        x: 79, y: 34, width: 24, height: 16,
+        direction: 'right',
+        textureX: 176, textureY: 14,
+        getValue: (p) => p.cookingProgress ?? 0,
+        getMax: (p) => p.totalCookTime || 200,
+      },
+    ],
+    slots: [
+      { index: 0, x: 56, y: 17, group: 'input' },
+      { index: 1, x: 56, y: 53, group: 'fuel', fuelSlot: true },
+      { index: 2, x: 116, y: 35, group: 'result', resultSlot: true },
+      // player inv: 3-29, hotbar: 30-38
+      ...playerInv(84, 3, 30),
+    ],
+  },
+
+  blast_furnace: {
+    name: 'blast_furnace',
+    title: 'Blast Furnace',
+    backgroundTexture: 'gui/container/blast_furnace',
+    backgroundWidth: 176,
+    backgroundHeight: 166,
+    properties: {
+      litTime: { dataSlot: 0, description: 'Fuel burn time remaining' },
+      litDuration: { dataSlot: 1, description: 'Max fuel burn time' },
+      cookingProgress: { dataSlot: 2, description: 'Cook progress (0-200)' },
+      totalCookTime: { dataSlot: 3, description: 'Total cook time' },
+    },
+    progressBars: [
+      {
+        id: 'fire',
+        x: 56, y: 36, width: 14, height: 14,
+        direction: 'up',
+        textureX: 176, textureY: 0,
+        getValue: (p) => p.litTime ?? 0,
+        getMax: (p) => p.litDuration || 200,
+      },
+      {
+        id: 'arrow',
+        x: 79, y: 34, width: 24, height: 16,
+        direction: 'right',
+        textureX: 176, textureY: 14,
+        getValue: (p) => p.cookingProgress ?? 0,
+        getMax: (p) => p.totalCookTime || 200,
+      },
+    ],
+    slots: [
+      { index: 0, x: 56, y: 17, group: 'input' },
+      { index: 1, x: 56, y: 53, group: 'fuel', fuelSlot: true },
+      { index: 2, x: 116, y: 35, group: 'result', resultSlot: true },
+      ...playerInv(84, 3, 30),
+    ],
+  },
+
+  smoker: {
+    name: 'smoker',
+    title: 'Smoker',
+    backgroundTexture: 'gui/container/smoker',
+    backgroundWidth: 176,
+    backgroundHeight: 166,
+    properties: {
+      litTime: { dataSlot: 0, description: 'Fuel burn time remaining' },
+      litDuration: { dataSlot: 1, description: 'Max fuel burn time' },
+      cookingProgress: { dataSlot: 2, description: 'Cook progress (0-200)' },
+      totalCookTime: { dataSlot: 3, description: 'Total cook time' },
+    },
+    progressBars: [
+      {
+        id: 'fire',
+        x: 56, y: 36, width: 14, height: 14,
+        direction: 'up',
+        textureX: 176, textureY: 0,
+        getValue: (p) => p.litTime ?? 0,
+        getMax: (p) => p.litDuration || 200,
+      },
+      {
+        id: 'arrow',
+        x: 79, y: 34, width: 24, height: 16,
+        direction: 'right',
+        textureX: 176, textureY: 14,
+        getValue: (p) => p.cookingProgress ?? 0,
+        getMax: (p) => p.totalCookTime || 200,
+      },
+    ],
+    slots: [
+      { index: 0, x: 56, y: 17, group: 'input' },
+      { index: 1, x: 56, y: 53, group: 'fuel', fuelSlot: true },
+      { index: 2, x: 116, y: 35, group: 'result', resultSlot: true },
+      // smoker: inv 3-29, hotbar: 30-38
+      ...playerInv(84, 3, 30),
+    ],
+  },
+
+  brewing_stand: {
+    name: 'brewing_stand',
+    title: 'Brewing Stand',
+    backgroundTexture: 'gui/container/brewing_stand',
+    backgroundWidth: 176,
+    backgroundHeight: 166,
+    properties: {
+      brewTime: { dataSlot: 0, description: 'Brew time remaining (0-400)' },
+      fuelLevel: { dataSlot: 1, description: 'Fuel level (0-20)' },
+    },
+    progressBars: [
+      {
+        id: 'brew_arrow',
+        x: 97, y: 16, width: 9, height: 28,
+        direction: 'down',
+        textureX: 176, textureY: 0,
+        getValue: (p) => 400 - (p.brewTime ?? 400),
+        getMax: () => 400,
+      },
+      {
+        id: 'fuel',
+        x: 18, y: 44, width: 18, height: 4,
+        direction: 'right',
+        textureX: 176, textureY: 29,
+        getValue: (p) => p.fuelLevel ?? 0,
+        getMax: () => 20,
+      },
+    ],
+    slots: [
+      { index: 0, x: 56, y: 51, group: 'bottle', label: 'Left' },
+      { index: 1, x: 79, y: 58, group: 'bottle', label: 'Center' },
+      { index: 2, x: 102, y: 51, group: 'bottle', label: 'Right' },
+      { index: 3, x: 79, y: 17, group: 'ingredient' },
+      { index: 4, x: 17, y: 17, group: 'fuel', fuelSlot: true },
+      // inv: 5-31, hotbar: 32-40
+      ...playerInv(84, 5, 32),
+    ],
+  },
+
+  anvil: {
+    name: 'anvil',
+    title: 'Repair & Name',
+    backgroundTexture: 'gui/container/anvil',
+    backgroundWidth: 176,
+    backgroundHeight: 166,
+    properties: {
+      repairCost: { dataSlot: 0, description: 'Level cost' },
+    },
+    slots: [
+      { index: 0, x: 27, y: 47, group: 'input' },
+      { index: 1, x: 76, y: 47, group: 'input' },
+      { index: 2, x: 134, y: 47, group: 'result', resultSlot: true },
+      // inv: 3-29, hotbar: 30-38
+      ...playerInv(84, 3, 30),
+    ],
+  },
+
+  grindstone: {
+    name: 'grindstone',
+    title: 'Repair & Disenchant',
+    backgroundTexture: 'gui/container/grindstone',
+    backgroundWidth: 176,
+    backgroundHeight: 166,
+    slots: [
+      { index: 0, x: 49, y: 19, group: 'input' },
+      { index: 1, x: 49, y: 40, group: 'input' },
+      { index: 2, x: 129, y: 34, group: 'result', resultSlot: true },
+      ...playerInv(84, 3, 30),
+    ],
+  },
+
+  enchanting_table: {
+    name: 'enchanting_table',
+    title: 'Enchant',
+    backgroundTexture: 'gui/container/enchanting_table',
+    backgroundWidth: 176,
+    backgroundHeight: 166,
+    properties: {
+      topEnchantLevel: { dataSlot: 0, description: 'Top enchantment level' },
+      middleEnchantLevel: { dataSlot: 1, description: 'Middle enchantment level' },
+      bottomEnchantLevel: { dataSlot: 2, description: 'Bottom enchantment level' },
+      seed: { dataSlot: 3, description: 'Random seed' },
+      topEnchantId: { dataSlot: 4, description: 'Top enchantment ID' },
+      middleEnchantId: { dataSlot: 5, description: 'Middle enchantment ID' },
+      bottomEnchantId: { dataSlot: 6, description: 'Bottom enchantment ID' },
+    },
+    slots: [
+      { index: 0, x: 15, y: 47, group: 'enchant' },
+      { index: 1, x: 35, y: 47, group: 'lapis', label: 'Lapis Lazuli' },
+      // inv: 2-28, hotbar: 29-37
+      ...playerInv(84, 2, 29),
+    ],
+  },
+
+  smithing_table: {
+    name: 'smithing_table',
+    title: 'Upgrade Gear',
+    backgroundTexture: 'gui/container/smithing',
+    guiTextureVersion: '1.21.4',
+    backgroundWidth: 176,
+    backgroundHeight: 166,
+    slots: [
+      { index: 0, x: 8, y: 48, group: 'template', label: 'Template' },
+      { index: 1, x: 26, y: 48, group: 'input', label: 'Base' },
+      { index: 2, x: 44, y: 48, group: 'addition', label: 'Material' },
+      { index: 3, x: 98, y: 48, group: 'result', resultSlot: true },
+      // inv: 4-30, hotbar: 31-39
+      ...playerInv(84, 4, 31),
+    ],
+  },
+
+  smithing_table_legacy: {
+    name: 'smithing_table_legacy',
+    title: 'Upgrade Gear',
+    backgroundTexture: 'gui/container/smithing',
+    backgroundWidth: 176,
+    backgroundHeight: 166,
+    slots: [
+      { index: 0, x: 27, y: 47, group: 'input', label: 'Base' },
+      { index: 1, x: 76, y: 47, group: 'addition', label: 'Material' },
+      { index: 2, x: 134, y: 47, group: 'result', resultSlot: true },
+      ...playerInv(84, 3, 30),
+    ],
+  },
+
+  hopper: {
+    name: 'hopper',
+    title: 'Item Hopper',
+    backgroundTexture: 'gui/container/hopper',
+    backgroundWidth: 176,
+    backgroundHeight: 133,
+    slots: [
+      ...gridSlots(0, 5, 1, 44, 20, 'container'),
+      ...Array.from({ length: 27 }, (_, i) => ({
+        index: 5 + i,
+        x: 8 + (i % 9) * SLOT_SIZE,
+        y: 51 + Math.floor(i / 9) * SLOT_SIZE,
+        group: 'inventory' as const,
+      })),
+      ...hotbarSlots(109, 32),
+    ],
+  },
+
+  dispenser: {
+    name: 'dispenser',
+    title: 'Dispenser',
+    backgroundTexture: 'gui/container/dispenser',
+    backgroundWidth: 176,
+    backgroundHeight: 166,
+    slots: [
+      ...gridSlots(0, 3, 3, 62, 17, 'container'),
+      // inv: 9-35, hotbar: 36-44
+      ...playerInv(84, 9, 36),
+    ],
+  },
+
+  dropper: {
+    name: 'dropper',
+    title: 'Dropper',
+    backgroundTexture: 'gui/container/dispenser',
+    backgroundWidth: 176,
+    backgroundHeight: 166,
+    slots: [
+      ...gridSlots(0, 3, 3, 62, 17, 'container'),
+      ...playerInv(84, 9, 36),
+    ],
+  },
+
+  beacon: {
+    name: 'beacon',
+    title: 'Beacon',
+    backgroundTexture: 'gui/container/beacon',
+    backgroundWidth: 230,
+    backgroundHeight: 219,
+    slots: [
+      { index: 0, x: 136, y: 110, group: 'payment', label: 'Payment' },
+      // inv: 1-27, hotbar: 28-36
+      ...playerInv(136, 1, 28),
+    ],
+  },
+
+  horse: {
+    name: 'horse',
+    title: 'Horse',
+    backgroundTexture: 'gui/container/horse',
+    backgroundWidth: 176,
+    backgroundHeight: 166,
+    slots: [
+      { index: 0, x: 8, y: 18, group: 'saddle', label: 'Saddle' },
+      { index: 1, x: 8, y: 36, group: 'armor', label: 'Horse Armor' },
+      // inv: 2-28, hotbar: 29-37
+      ...playerInv(84, 2, 29),
+    ],
+  },
+
+  donkey: {
+    name: 'donkey',
+    title: 'Donkey',
+    backgroundTexture: 'gui/container/horse',
+    backgroundWidth: 176,
+    backgroundHeight: 166,
+    slots: [
+      { index: 0, x: 8, y: 18, group: 'saddle', label: 'Saddle' },
+      // chest items 2-16 (3x5) when has chest
+      ...Array.from({ length: 15 }, (_, i) => ({
+        index: 2 + i,
+        x: 80 + (i % 5) * SLOT_SIZE,
+        y: 18 + Math.floor(i / 5) * SLOT_SIZE,
+        group: 'chest' as const,
+      })),
+      // inv: 17-43, hotbar: 44-52 (after 2 equipment + 15 chest)
+      ...playerInv(84, 17, 44),
+    ],
+  },
+
+  llama: {
+    name: 'llama',
+    title: 'Llama',
+    backgroundTexture: 'gui/container/horse',
+    backgroundWidth: 176,
+    backgroundHeight: 166,
+    slots: [
+      { index: 0, x: 8, y: 18, group: 'saddle', label: 'Carpet' },
+      ...Array.from({ length: 15 }, (_, i) => ({
+        index: 2 + i,
+        x: 80 + (i % 5) * SLOT_SIZE,
+        y: 18 + Math.floor(i / 5) * SLOT_SIZE,
+        group: 'chest' as const,
+      })),
+      ...playerInv(84, 17, 44),
+    ],
+  },
+
+  villager: {
+    name: 'villager',
+    title: 'Villager',
+    backgroundTexture: 'gui/container/villager2',
+    backgroundWidth: 276,
+    backgroundHeight: 166,
+    slots: [
+      { index: 0, x: 136, y: 37, group: 'trade_input1' },
+      { index: 1, x: 162, y: 37, group: 'trade_input2' },
+      { index: 2, x: 216, y: 37, group: 'trade_result', resultSlot: true },
+      ...Array.from({ length: 27 }, (_, i) => ({
+        index: 3 + i,
+        x: 108 + (i % 9) * SLOT_SIZE,
+        y: 84 + Math.floor(i / 9) * SLOT_SIZE,
+        group: 'inventory' as const,
+      })),
+      ...hotbarSlots(142, 30, 108),
+    ],
+  },
+
+  shulker_box: {
+    name: 'shulker_box',
+    title: 'Shulker Box',
+    backgroundTexture: 'gui/container/shulker_box',
+    backgroundWidth: 176,
+    backgroundHeight: 166,
+    slots: [
+      ...gridSlots(0, 9, 3, 8, 18, 'container'),
+      ...playerInv(84, 27, 54),
+    ],
+  },
+
+  barrel: {
+    name: 'barrel',
+    title: 'Barrel',
+    backgroundTexture: 'gui/container/shulker_box',
+    backgroundWidth: 176,
+    backgroundHeight: 166,
+    slots: [
+      ...gridSlots(0, 9, 3, 8, 18, 'container'),
+      ...playerInv(84, 27, 54),
+    ],
+  },
+
+  cartography_table: {
+    name: 'cartography_table',
+    title: 'Cartography Table',
+    backgroundTexture: 'gui/container/cartography_table',
+    backgroundWidth: 176,
+    backgroundHeight: 166,
+    slots: [
+      { index: 0, x: 15, y: 15, group: 'input', label: 'Map' },
+      { index: 1, x: 15, y: 39, group: 'input', label: 'Paper/Map' },
+      { index: 2, x: 145, y: 39, group: 'result', resultSlot: true },
+      ...playerInv(84, 3, 30),
+    ],
+  },
+
+  loom: {
+    name: 'loom',
+    title: 'Loom',
+    backgroundTexture: 'gui/container/loom',
+    backgroundWidth: 176,
+    backgroundHeight: 166,
+    slots: [
+      { index: 0, x: 13, y: 26, group: 'input', label: 'Banner' },
+      { index: 1, x: 33, y: 26, group: 'input', label: 'Dye' },
+      { index: 2, x: 23, y: 45, group: 'input', label: 'Pattern' },
+      { index: 3, x: 143, y: 58, group: 'result', resultSlot: true },
+      ...playerInv(84, 4, 31),
+    ],
+  },
+
+  stonecutter: {
+    name: 'stonecutter',
+    title: 'Stonecutter',
+    backgroundTexture: 'gui/container/stonecutter',
+    backgroundWidth: 176,
+    backgroundHeight: 166,
+    slots: [
+      { index: 0, x: 20, y: 33, group: 'input' },
+      { index: 1, x: 143, y: 33, group: 'result', resultSlot: true },
+      ...playerInv(84, 2, 29),
+    ],
+  },
+
+  lectern: {
+    name: 'lectern',
+    title: 'Lectern',
+    backgroundTexture: 'gui/container/lectern',
+    backgroundWidth: 176,
+    backgroundHeight: 166,
+    slots: [],
+  },
+
+  crafter: {
+    name: 'crafter',
+    title: 'Crafter',
+    backgroundTexture: 'gui/container/crafter',
+    guiTextureVersion: '1.21.4',
+    backgroundWidth: 176,
+    backgroundHeight: 166,
+    slots: [
+      ...gridSlots(0, 3, 3, 30, 17, 'crafting'),
+      { index: 9, x: 124, y: 35, group: 'result', resultSlot: true },
+      ...playerInv(84, 10, 37),
+    ],
+  },
+
+  creative: {
+    name: 'creative',
+    title: 'Creative Inventory',
+    backgroundTexture: 'gui/container/creative_inventory/tab_items',
+    backgroundWidth: 195,
+    backgroundHeight: 136,
+    slots: [
+      ...gridSlots(0, 9, 5, 9, 48, 'body'),
+      ...hotbarSlots(142, 0),
+    ],
+  },
+}

package/src/styles/tokens.css

@@ -0,0 +1,47 @@
+/* Minecraft Inventory GUI - Design Tokens
+   All sizes use CSS custom properties driven by --mc-scale
+   so the entire UI scales without transform */
+
+:root {
+  --mc-scale: 2;
+
+  /* Computed from scale */
+  --mc-slot-size: calc(18px * var(--mc-scale));
+  --mc-font-size: calc(7px * var(--mc-scale));
+  --mc-pixel: calc(1px * var(--mc-scale));
+  --mc-border: calc(1px * var(--mc-scale));
+  --mc-gap: calc(2px * var(--mc-scale));
+  --mc-padding: calc(4px * var(--mc-scale));
+  --mc-count-font: calc(6px * var(--mc-scale));
+
+  /* Colors */
+  --mc-bg: #c6c6c6;
+  --mc-dark: #404040;
+  --mc-darker: #282828;
+  --mc-slot-bg: #8b8b8b;
+  --mc-slot-border-light: #ffffff;
+  --mc-slot-border-dark: #373737;
+  --mc-tooltip-bg: #100010;
+  --mc-tooltip-border: #5000ff;
+  --mc-tooltip-text: #ffffff;
+  --mc-tooltip-lore: #6b29a4;
+  --mc-highlight: rgba(255,255,255,0.4);
+  --mc-held-highlight: rgba(255,255,255,0.5);
+  --mc-text-shadow: rgba(0,0,0,0.5);
+  --mc-count-color: #ffffff;
+  --mc-enchant-color: #8080ff;
+  --mc-durability-full: #55ff55;
+  --mc-durability-low: #ff5555;
+}
+
+.mc-inv-root {
+  font-family: 'Minecraftia', 'Minecraft', monospace;
+  image-rendering: pixelated;
+  image-rendering: crisp-edges;
+  user-select: none;
+  -webkit-user-select: none;
+}
+
+.mc-inv-root * {
+  box-sizing: border-box;
+}