From 13c185a2160769764bcd766cac31d711bd62d3fc Mon Sep 17 00:00:00 2001 From: n8n-gitea Date: Thu, 28 May 2026 15:28:18 +0200 Subject: [PATCH] feat: add DebugName wrappers to 56 components + redesign attunement cards + remove ScrollArea from AttunementsTab --- docs/circular-deps.txt | 2 +- docs/dependency-graph.json | 2 +- src/app/page.tsx | 3 + src/components/game/ActionButtons.tsx | 53 ++++--- src/components/game/ActivityLogPanel.tsx | 5 +- src/components/game/AttunementStatus.tsx | 119 +++++++------- src/components/game/GameToast.tsx | 27 ++-- .../game/LootInventory/BlueprintsSection.tsx | 3 + .../game/LootInventory/EquipmentItem.tsx | 3 + .../game/LootInventory/EssenceItem.tsx | 3 + .../game/LootInventory/MaterialItem.tsx | 3 + src/components/game/ManaDisplay.tsx | 11 +- src/components/game/TimeDisplay.tsx | 31 ++-- src/components/game/UpgradeDialog.tsx | 11 +- .../game/crafting/EnchantmentApplier.tsx | 13 +- .../game/crafting/EnchantmentDesigner.tsx | 3 + .../EnchantmentDesigner/DesignForm.tsx | 3 + .../EnchantmentDesigner/EffectSelector.tsx | 5 +- .../EquipmentTypeSelector.tsx | 3 + .../EnchantmentDesigner/SavedDesigns.tsx | 3 + .../game/crafting/EnchantmentPreparer.tsx | 3 + .../game/crafting/EquipmentCrafter.tsx | 3 + src/components/game/debug/AttunementDebug.tsx | 3 + src/components/game/debug/ElementDebug.tsx | 3 + src/components/game/debug/GameStateDebug.tsx | 4 +- src/components/game/debug/GolemDebug.tsx | 3 + src/components/game/debug/PactDebug.tsx | 3 + src/components/game/tabs/ActivityLog.tsx | 15 +- src/components/game/tabs/AttunementsTab.tsx | 134 ++++++++++++---- .../game/tabs/CraftingTab/EnchanterSubTab.tsx | 3 + .../tabs/CraftingTab/FabricatorSubTab.tsx | 3 + .../tabs/CraftingTab/MaterialRecipeCard.tsx | 3 + .../tabs/DebugTab/AchievementDebugSection.tsx | 85 +++++----- .../tabs/DebugTab/AttunementDebugSection.tsx | 93 +++++------ .../tabs/DebugTab/DisciplineDebugSection.tsx | 147 +++++++++--------- .../tabs/DebugTab/ElementDebugSection.tsx | 115 +++++++------- .../tabs/DebugTab/GameStateDebugSection.tsx | 28 ++-- .../game/tabs/DebugTab/GolemDebugSection.tsx | 93 +++++------ .../game/tabs/DebugTab/PactDebugSection.tsx | 71 +++++---- .../game/tabs/DebugTab/SpireDebugSection.tsx | 119 +++++++------- .../EquipmentTab/EquipmentEffectsSummary.tsx | 3 + .../tabs/EquipmentTab/EquipmentSlotGrid.tsx | 3 + .../game/tabs/EquipmentTab/InventoryList.tsx | 3 + src/components/game/tabs/SpellsTab.tsx | 7 +- .../game/tabs/SpireCombatPage/RoomDisplay.tsx | 3 + .../tabs/SpireCombatPage/SpireActivityLog.tsx | 3 + .../SpireCombatPage/SpireCombatControls.tsx | 3 + .../tabs/SpireCombatPage/SpireCombatPage.tsx | 3 + .../game/tabs/SpireCombatPage/SpireHeader.tsx | 3 + .../tabs/SpireCombatPage/SpireManaDisplay.tsx | 3 + src/components/game/tabs/StatsTab.tsx | 7 +- .../game/tabs/StatsTab/CombatStatsSection.tsx | 3 + .../tabs/StatsTab/DisciplineStatsSection.tsx | 3 + .../tabs/StatsTab/ElementStatsSection.tsx | 3 + .../game/tabs/StatsTab/LoopStatsSection.tsx | 3 + .../game/tabs/StatsTab/ManaStatsSection.tsx | 3 + .../game/tabs/StatsTab/PactStatusSection.tsx | 3 + .../game/tabs/StatsTab/StudyStatsSection.tsx | 3 + .../game/tabs/guardian-pacts-components.tsx | 21 +-- 59 files changed, 781 insertions(+), 539 deletions(-) diff --git a/docs/circular-deps.txt b/docs/circular-deps.txt index 53ebdb8..e644173 100644 --- a/docs/circular-deps.txt +++ b/docs/circular-deps.txt @@ -1,4 +1,4 @@ # Circular Dependencies -Generated: 2026-05-28T11:15:20.183Z +Generated: 2026-05-28T11:45:27.810Z No circular dependencies found. ✅ diff --git a/docs/dependency-graph.json b/docs/dependency-graph.json index 64c97d6..2d14e0f 100644 --- a/docs/dependency-graph.json +++ b/docs/dependency-graph.json @@ -1,6 +1,6 @@ { "_meta": { - "generated": "2026-05-28T11:15:18.333Z", + "generated": "2026-05-28T11:45:26.075Z", "description": "Import dependency graph for src/lib/game. Keys are files, values are arrays of files they import.", "usage": "To find what a file affects, search for its path in the VALUES. To find what a file depends on, look at its KEY entry." }, diff --git a/src/app/page.tsx b/src/app/page.tsx index 3ca6f36..d524175 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -21,6 +21,7 @@ import { useGameLoop } from '@/lib/game/stores/gameHooks'; import { getUnifiedEffects } from '@/lib/game/effects'; import { hasSpecial, SPECIAL_EFFECTS } from '@/lib/game/effects'; import { TimeDisplay } from '@/components/game'; +import { DebugName } from '@/components/game/debug/debug-context'; import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs'; import { TooltipProvider } from '@/components/ui/tooltip'; @@ -197,6 +198,7 @@ export default function ManaLoopGame() { } return ( +
@@ -235,5 +237,6 @@ export default function ManaLoopGame() {
+ ); } diff --git a/src/components/game/ActionButtons.tsx b/src/components/game/ActionButtons.tsx index 264e8f3..5fa49bc 100755 --- a/src/components/game/ActionButtons.tsx +++ b/src/components/game/ActionButtons.tsx @@ -1,6 +1,7 @@ 'use client'; import { Sparkles, Swords, BookOpen, Target, FlaskConical, Cog, Hammer, Dumbbell } from 'lucide-react'; +import { DebugName } from '@/components/game/debug/debug-context'; import type { GameAction } from '@/lib/game/types'; interface ActionButtonsProps { @@ -119,33 +120,35 @@ export function ActionButtons({ }; return ( -
-
-
- - Current Activity -
-
- {config.label} -
- {getActionDetails()} - - {/* Show second design slot if active */} - {designProgress2 && ( -
-
- - Second Design Slot -
- + +
+
+
+ + Current Activity
- )} +
+ {config.label} +
+ {getActionDetails()} + + {/* Show second design slot if active */} + {designProgress2 && ( +
+
+ + Second Design Slot +
+ +
+ )} +
-
+ ); } diff --git a/src/components/game/ActivityLogPanel.tsx b/src/components/game/ActivityLogPanel.tsx index ff74de3..dc4a2d1 100644 --- a/src/components/game/ActivityLogPanel.tsx +++ b/src/components/game/ActivityLogPanel.tsx @@ -1,6 +1,7 @@ 'use client'; import { useCombatStore } from '@/lib/game/stores'; +import { DebugName } from '@/components/game/debug/debug-context'; import { ActivityLog } from './tabs/ActivityLog'; /** @@ -12,7 +13,9 @@ export function ActivityLogPanel() { const activityLog = useCombatStore((s) => s.activityLog); return ( - + + + ); } diff --git a/src/components/game/AttunementStatus.tsx b/src/components/game/AttunementStatus.tsx index 9f825ba..70c1889 100644 --- a/src/components/game/AttunementStatus.tsx +++ b/src/components/game/AttunementStatus.tsx @@ -1,6 +1,7 @@ 'use client'; import { useMemo } from 'react'; +import { DebugName } from '@/components/game/debug/debug-context'; import { useAttunementStore } from '@/lib/game/stores'; import { ATTUNEMENTS_DEF } from '@/lib/game/data/attunements'; import { Separator } from '@/components/ui/separator'; @@ -38,70 +39,72 @@ export function AttunementStatus() { }; return ( -
-
- Attunements - {activeAttunements.length} active -
- -
- {activeAttunements.length === 0 ? ( -
No attunements active
- ) : ( - activeAttunements.map(([id, state]) => { - const def = ATTUNEMENTS_DEF[id]; - if (!def) return null; - const nextXp = xpForNext(state.level); - const xpProgress = nextXp > 0 ? (state.experience / nextXp) * 100 : 0; + +
+
+ Attunements + {activeAttunements.length} active +
+ +
+ {activeAttunements.length === 0 ? ( +
No attunements active
+ ) : ( + activeAttunements.map(([id, state]) => { + const def = ATTUNEMENTS_DEF[id]; + if (!def) return null; + const nextXp = xpForNext(state.level); + const xpProgress = nextXp > 0 ? (state.experience / nextXp) * 100 : 0; - return ( - - - -
- {def.icon} -
-
- - {def.name} - - - Lv.{state.level} - -
-
- {SLOT_LABELS[def.slot] || def.slot} - {nextXp > 0 && ( - - {Math.floor(state.experience).toLocaleString()}/{nextXp.toLocaleString()} XP + return ( + + + +
+ {def.icon} +
+
+ + {def.name} + + Lv.{state.level} + +
+
+ {SLOT_LABELS[def.slot] || def.slot} + {nextXp > 0 && ( + + {Math.floor(state.experience).toLocaleString()}/{nextXp.toLocaleString()} XP + + )} +
+ {nextXp > 0 && ( +
+
+
)}
- {nextXp > 0 && ( -
-
-
- )}
-
- - -

{def.desc}

- - - - ); - }) - )} + + +

{def.desc}

+ + + + ); + }) + )} +
-
+ ); } diff --git a/src/components/game/GameToast.tsx b/src/components/game/GameToast.tsx index 0f42c69..180e1e8 100644 --- a/src/components/game/GameToast.tsx +++ b/src/components/game/GameToast.tsx @@ -1,6 +1,7 @@ 'use client'; import { useToast } from '@/hooks/use-toast'; +import { DebugName } from '@/components/game/debug/debug-context'; import { Toast, ToastClose, @@ -61,8 +62,9 @@ export function GameToaster() { const { toasts } = useToast(); return ( - - {toasts.map((toast) => { + + + {toasts.map((toast) => { // Determine toast type from className or default to info const toastType: ToastType = toast.variant === 'destructive' ? 'error' : @@ -103,16 +105,17 @@ export function GameToaster() { - Desktop: bottom-right - Mobile: bottom-center, full-width */} - - + + + ); } diff --git a/src/components/game/LootInventory/BlueprintsSection.tsx b/src/components/game/LootInventory/BlueprintsSection.tsx index 89ad71d..3819e73 100644 --- a/src/components/game/LootInventory/BlueprintsSection.tsx +++ b/src/components/game/LootInventory/BlueprintsSection.tsx @@ -1,5 +1,6 @@ 'use client'; +import { DebugName } from '@/components/game/debug/debug-context'; import { Scroll } from 'lucide-react'; import { Badge } from '@/components/ui/badge'; import { LOOT_DROPS } from '@/lib/game/data/loot-drops'; @@ -13,6 +14,7 @@ export function BlueprintsSection({ blueprints }: BlueprintsSectionProps) { if (blueprints.length === 0) return null; return ( +
@@ -42,5 +44,6 @@ export function BlueprintsSection({ blueprints }: BlueprintsSectionProps) { Blueprints are permanent unlocks - use them to craft equipment
+ ); } diff --git a/src/components/game/LootInventory/EquipmentItem.tsx b/src/components/game/LootInventory/EquipmentItem.tsx index ef6b4aa..fa0dba6 100644 --- a/src/components/game/LootInventory/EquipmentItem.tsx +++ b/src/components/game/LootInventory/EquipmentItem.tsx @@ -1,5 +1,6 @@ 'use client'; +import { DebugName } from '@/components/game/debug/debug-context'; import { Package, Trash2 } from 'lucide-react'; import type { EquipmentInstance } from '@/lib/game/types'; import { EQUIPMENT_TYPES } from '@/lib/game/data/equipment'; @@ -20,6 +21,7 @@ export function EquipmentItem({ instanceId, instance, onDelete }: EquipmentItemP const rarityGlow = RARITY_GLOW_CSS_VAR[instance.rarity] || 'var(--rarity-common-glow)'; return ( +
+ ); } diff --git a/src/components/game/LootInventory/EssenceItem.tsx b/src/components/game/LootInventory/EssenceItem.tsx index 339a515..7abfda4 100644 --- a/src/components/game/LootInventory/EssenceItem.tsx +++ b/src/components/game/LootInventory/EssenceItem.tsx @@ -1,5 +1,6 @@ 'use client'; +import { DebugName } from '@/components/game/debug/debug-context'; import { Droplet } from 'lucide-react'; import { ElementBadge } from '@/components/ui/element-badge'; import type { ElementState } from '@/lib/game/types'; @@ -15,6 +16,7 @@ export function EssenceItem({ elementId, state }: EssenceItemProps) { if (!elem) return null; return ( +
+ ); } diff --git a/src/components/game/LootInventory/MaterialItem.tsx b/src/components/game/LootInventory/MaterialItem.tsx index 7378403..7b85f19 100644 --- a/src/components/game/LootInventory/MaterialItem.tsx +++ b/src/components/game/LootInventory/MaterialItem.tsx @@ -1,5 +1,6 @@ 'use client'; +import { DebugName } from '@/components/game/debug/debug-context'; import type { LootInventory } from '@/lib/game/types'; // For backward compatibility type LootInventoryType = LootInventory; @@ -22,6 +23,7 @@ export function MaterialItem({ materialId, count, onDelete }: MaterialItemProps) const rarityGlow = RARITY_GLOW_CSS_VAR[drop.rarity] || 'var(--rarity-common-glow)'; return ( +
+ ); } diff --git a/src/components/game/ManaDisplay.tsx b/src/components/game/ManaDisplay.tsx index 47669ef..c97d382 100755 --- a/src/components/game/ManaDisplay.tsx +++ b/src/components/game/ManaDisplay.tsx @@ -7,6 +7,7 @@ import { Zap, ChevronDown, ChevronUp } from 'lucide-react'; import { fmt, fmtDec } from '@/lib/game/stores'; import { ELEMENTS } from '@/lib/game/constants'; import { useState } from 'react'; +import { DebugName } from '@/components/game/debug/debug-context'; interface ManaDisplayProps { rawMana: number; @@ -39,8 +40,9 @@ export function ManaDisplay({ .sort((a, b) => b[1].current - a[1].current); return ( - - + + + {/* Raw Mana - Main Display */}
@@ -133,8 +135,9 @@ export function ManaDisplay({ )}
)} - - + + + ); } diff --git a/src/components/game/TimeDisplay.tsx b/src/components/game/TimeDisplay.tsx index 0cf02f6..fa6dbe8 100755 --- a/src/components/game/TimeDisplay.tsx +++ b/src/components/game/TimeDisplay.tsx @@ -1,6 +1,7 @@ 'use client'; import { fmt } from '@/lib/game/stores'; +import { DebugName } from '@/components/game/debug/debug-context'; import { formatHour } from '@/lib/game/utils/formatting'; interface TimeDisplayProps { @@ -15,23 +16,25 @@ export function TimeDisplay({ insight, }: TimeDisplayProps) { return ( -
-
-
- Day {day} + +
+
+
+ Day {day} +
+
+ {formatHour(hour)} +
-
- {formatHour(hour)} + +
+
+ {fmt(insight)} +
+
Insight
- -
-
- {fmt(insight)} -
-
Insight
-
-
+ ); } diff --git a/src/components/game/UpgradeDialog.tsx b/src/components/game/UpgradeDialog.tsx index a5ffdcf..cf1def1 100755 --- a/src/components/game/UpgradeDialog.tsx +++ b/src/components/game/UpgradeDialog.tsx @@ -1,6 +1,7 @@ 'use client'; import type { SkillUpgradeChoice } from '@/lib/game/types'; +import { DebugName } from '@/components/game/debug/debug-context'; import { Button } from '@/components/ui/button'; import { Badge } from '@/components/ui/badge'; import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogDescription } from '@/components/ui/dialog'; @@ -35,8 +36,9 @@ export function UpgradeDialog({ const currentSelections = pendingSelections.length > 0 ? pendingSelections : alreadySelected; return ( - - + + + Choose Upgrade - {skillId} @@ -107,8 +109,9 @@ export function UpgradeDialog({ {currentSelections.length < 2 ? `Select ${2 - currentSelections.length} more` : 'Confirm'}
- - + + + ); } diff --git a/src/components/game/crafting/EnchantmentApplier.tsx b/src/components/game/crafting/EnchantmentApplier.tsx index fd9388a..5a4ab98 100644 --- a/src/components/game/crafting/EnchantmentApplier.tsx +++ b/src/components/game/crafting/EnchantmentApplier.tsx @@ -11,6 +11,7 @@ import type { EquipmentSlot } from '@/lib/game/data/equipment'; import { fmt } from '@/lib/game/stores'; import { CheckCircle, Sparkles } from 'lucide-react'; import { useCraftingStore, useManaStore } from '@/lib/game/stores'; +import { DebugName } from '@/components/game/debug/debug-context'; export interface EnchantmentApplierProps { selectedEquipmentInstance: string | null; @@ -51,23 +52,24 @@ export function EnchantmentApplier({ // Handle apply button click const handleApply = () => { if (!selectedEquipmentInstance || !selectedDesign) return; - + const instance = equipmentInstances[selectedEquipmentInstance]; const design = enchantmentDesigns.find(d => d.id === selectedDesign); - + if (!instance || !design) return; - + // Check capacity const availableCap = instance.totalCapacity - instance.usedCapacity; if (availableCap < design.totalCapacityUsed) { onCapacityExceeded?.(instance.name, instance.usedCapacity, instance.totalCapacity); return; } - + startApplying(selectedEquipmentInstance, selectedDesign); }; return ( +
{/* Equipment & Design Selection */} @@ -217,7 +219,7 @@ export function EnchantmentApplier({ return (
{design.name}
-
→ {instance.name}
+
{instance.name}
Ready for Enchantment @@ -271,6 +273,7 @@ export function EnchantmentApplier({ )}
+ ); } diff --git a/src/components/game/crafting/EnchantmentDesigner.tsx b/src/components/game/crafting/EnchantmentDesigner.tsx index 31239c4..0007694 100644 --- a/src/components/game/crafting/EnchantmentDesigner.tsx +++ b/src/components/game/crafting/EnchantmentDesigner.tsx @@ -20,6 +20,7 @@ import { removeEffectFromDesign, } from './EnchantmentDesigner/utils'; import { useCraftingStore } from '@/lib/game/stores'; +import { DebugName } from '@/components/game/debug/debug-context'; export function EnchantmentDesigner({ selectedEquipmentType, @@ -88,6 +89,7 @@ export function EnchantmentDesigner({ // Render stage return ( +
{/* Equipment Type Selection */}
+ ); } diff --git a/src/components/game/crafting/EnchantmentDesigner/DesignForm.tsx b/src/components/game/crafting/EnchantmentDesigner/DesignForm.tsx index 4f65b77..d03b121 100644 --- a/src/components/game/crafting/EnchantmentDesigner/DesignForm.tsx +++ b/src/components/game/crafting/EnchantmentDesigner/DesignForm.tsx @@ -3,6 +3,7 @@ import { ActionButton } from '@/components/ui/action-button'; import { StatRow } from '@/components/ui/stat-row'; import type { DesignFormProps } from './types'; +import { DebugName } from '@/components/game/debug/debug-context'; export function DesignForm({ designName, @@ -15,6 +16,7 @@ export function DesignForm({ handleCreateDesign, }: DesignFormProps) { return ( +
+ ); } diff --git a/src/components/game/crafting/EnchantmentDesigner/EffectSelector.tsx b/src/components/game/crafting/EnchantmentDesigner/EffectSelector.tsx index 45e38d9..48384eb 100644 --- a/src/components/game/crafting/EnchantmentDesigner/EffectSelector.tsx +++ b/src/components/game/crafting/EnchantmentDesigner/EffectSelector.tsx @@ -8,6 +8,7 @@ import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '@/comp import { AlertCircle, Wand2, Plus, Minus } from 'lucide-react'; import { ENCHANTMENT_EFFECTS, calculateEffectCapacityCost } from '@/lib/game/data/enchantment-effects'; import type { EffectSelectorProps } from './types'; +import { DebugName } from '@/components/game/debug/debug-context'; export function EffectSelector({ selectedEquipmentType, @@ -22,6 +23,7 @@ export function EffectSelector({ getIncompatibilityReason, }: EffectSelectorProps) { return ( + <> {enchantingLevel < 1 ? (
@@ -84,7 +86,7 @@ export function EffectSelector({ )} addEffect(effect.id)} disabled={!selected && selectedEffects.length >= 5} @@ -143,6 +145,7 @@ export function EffectSelector({ )} + ); } diff --git a/src/components/game/crafting/EnchantmentDesigner/EquipmentTypeSelector.tsx b/src/components/game/crafting/EnchantmentDesigner/EquipmentTypeSelector.tsx index 97d5a1e..d0005bf 100644 --- a/src/components/game/crafting/EnchantmentDesigner/EquipmentTypeSelector.tsx +++ b/src/components/game/crafting/EnchantmentDesigner/EquipmentTypeSelector.tsx @@ -6,6 +6,7 @@ import { ActionButton } from '@/components/ui/action-button'; import { Progress } from '@/components/ui/progress'; import { ScrollArea } from '@/components/ui/scroll-area'; import type { EquipmentTypeSelectorProps } from './types'; +import { DebugName } from '@/components/game/debug/debug-context'; export function EquipmentTypeSelector({ ownedEquipmentTypes, @@ -15,6 +16,7 @@ export function EquipmentTypeSelector({ cancelDesign, }: EquipmentTypeSelectorProps) { return ( + {designProgress ? ( @@ -61,6 +63,7 @@ export function EquipmentTypeSelector({ )} + ); } diff --git a/src/components/game/crafting/EnchantmentDesigner/SavedDesigns.tsx b/src/components/game/crafting/EnchantmentDesigner/SavedDesigns.tsx index 2e19618..9ac66be 100644 --- a/src/components/game/crafting/EnchantmentDesigner/SavedDesigns.tsx +++ b/src/components/game/crafting/EnchantmentDesigner/SavedDesigns.tsx @@ -6,6 +6,7 @@ import { ActionButton } from '@/components/ui/action-button'; import { Trash2 } from 'lucide-react'; import { EQUIPMENT_TYPES } from '@/lib/game/data/equipment'; import type { SavedDesignsProps } from './types'; +import { DebugName } from '@/components/game/debug/debug-context'; export function SavedDesigns({ enchantmentDesigns, @@ -14,6 +15,7 @@ export function SavedDesigns({ deleteDesign, }: SavedDesignsProps) { return ( + {enchantmentDesigns.length === 0 ? ( @@ -63,6 +65,7 @@ export function SavedDesigns({
)} + ); } diff --git a/src/components/game/crafting/EnchantmentPreparer.tsx b/src/components/game/crafting/EnchantmentPreparer.tsx index 0c731d0..7585135 100644 --- a/src/components/game/crafting/EnchantmentPreparer.tsx +++ b/src/components/game/crafting/EnchantmentPreparer.tsx @@ -14,6 +14,7 @@ import type { EquipmentSlot } from '@/lib/game/types'; import { fmt } from '@/lib/game/stores'; import { useCraftingStore, useManaStore } from '@/lib/game/stores'; import { useGameToast } from '@/components/game/GameToast'; +import { DebugName } from '@/components/game/debug/debug-context'; export interface EnchantmentPreparerProps { selectedEquipmentInstance: string | null; @@ -72,6 +73,7 @@ export function EnchantmentPreparer({ }; return ( +
{/* Equipment Selection */} @@ -296,6 +298,7 @@ export function EnchantmentPreparer({ )}
+ ); } diff --git a/src/components/game/crafting/EquipmentCrafter.tsx b/src/components/game/crafting/EquipmentCrafter.tsx index 9169c75..34f3b5c 100644 --- a/src/components/game/crafting/EquipmentCrafter.tsx +++ b/src/components/game/crafting/EquipmentCrafter.tsx @@ -12,6 +12,7 @@ import { LOOT_DROPS, LOOT_RARITY_COLORS } from '@/lib/game/data/loot-drops'; import type { LootInventory } from '@/lib/game/types'; import { fmt } from '@/lib/game/stores'; import { useCraftingStore, useCombatStore, useManaStore } from '@/lib/game/stores'; +import { DebugName } from '@/components/game/debug/debug-context'; // ─── Crafting Progress ─────────────────────────────────────────────────────── @@ -222,6 +223,7 @@ export function EquipmentCrafter() { const currentAction = useCombatStore((s) => s.currentAction); return ( +
@@ -241,6 +243,7 @@ export function EquipmentCrafter() {
+ ); } diff --git a/src/components/game/debug/AttunementDebug.tsx b/src/components/game/debug/AttunementDebug.tsx index 5ad832e..67cdb64 100644 --- a/src/components/game/debug/AttunementDebug.tsx +++ b/src/components/game/debug/AttunementDebug.tsx @@ -1,5 +1,6 @@ 'use client'; +import { DebugName } from '@/components/game/debug/debug-context'; import { Button } from '@/components/ui/button'; import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'; import { Sparkles, Unlock } from 'lucide-react'; @@ -30,6 +31,7 @@ export function AttunementDebug() { }; return ( + @@ -75,6 +77,7 @@ export function AttunementDebug() { })} + ); } diff --git a/src/components/game/debug/ElementDebug.tsx b/src/components/game/debug/ElementDebug.tsx index 8c6963b..48cefcb 100644 --- a/src/components/game/debug/ElementDebug.tsx +++ b/src/components/game/debug/ElementDebug.tsx @@ -1,5 +1,6 @@ 'use client'; +import { DebugName } from '@/components/game/debug/debug-context'; import { Button } from '@/components/ui/button'; import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'; import { Star, Lock } from 'lucide-react'; @@ -21,6 +22,7 @@ export function ElementDebug() { }; return ( + @@ -73,6 +75,7 @@ export function ElementDebug() {
+ ); } diff --git a/src/components/game/debug/GameStateDebug.tsx b/src/components/game/debug/GameStateDebug.tsx index b310d9c..70827e4 100644 --- a/src/components/game/debug/GameStateDebug.tsx +++ b/src/components/game/debug/GameStateDebug.tsx @@ -9,7 +9,7 @@ import { Label } from '@/components/ui/label'; import { RotateCcw, AlertTriangle, Zap, Clock, Settings, Eye, } from 'lucide-react'; -import { useDebug } from '@/components/game/debug/debug-context'; +import { DebugName, useDebug } from '@/components/game/debug/debug-context'; import { useGameStore, useManaStore, useUIStore, useCombatStore } from '@/lib/game/stores'; import { computeMaxMana } from '@/lib/game/stores'; @@ -282,6 +282,7 @@ export function GameStateDebug() { }; return ( +
@@ -298,6 +299,7 @@ export function GameStateDebug() { />
+ ); } diff --git a/src/components/game/debug/GolemDebug.tsx b/src/components/game/debug/GolemDebug.tsx index 23789c0..168c6bf 100644 --- a/src/components/game/debug/GolemDebug.tsx +++ b/src/components/game/debug/GolemDebug.tsx @@ -1,10 +1,12 @@ 'use client'; +import { DebugName } from '@/components/game/debug/debug-context'; import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'; import { Bug } from 'lucide-react'; export function GolemDebug() { return ( + @@ -18,6 +20,7 @@ export function GolemDebug() {

+ ); } diff --git a/src/components/game/debug/PactDebug.tsx b/src/components/game/debug/PactDebug.tsx index 3efd4f8..5bedf43 100644 --- a/src/components/game/debug/PactDebug.tsx +++ b/src/components/game/debug/PactDebug.tsx @@ -1,5 +1,6 @@ 'use client'; +import { DebugName } from '@/components/game/debug/debug-context'; import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'; import { Button } from '@/components/ui/button'; import { Bug } from 'lucide-react'; @@ -140,6 +141,7 @@ export function PactDebug() { }; return ( + @@ -174,6 +176,7 @@ export function PactDebug() {
+ ); } diff --git a/src/components/game/tabs/ActivityLog.tsx b/src/components/game/tabs/ActivityLog.tsx index 5b6d8dc..febb046 100644 --- a/src/components/game/tabs/ActivityLog.tsx +++ b/src/components/game/tabs/ActivityLog.tsx @@ -1,4 +1,5 @@ import type { ActivityLogEntry } from '@/lib/game/types'; +import { DebugName } from '@/components/game/debug/debug-context'; interface ActivityLogProps { activityLog: ActivityLogEntry[]; @@ -10,14 +11,17 @@ export function ActivityLog({ activityLog, maxEntries = 20 }: ActivityLogProps) if (entries.length === 0) { return ( -
- No activity yet. -
+ +
+ No activity yet. +
+ ); } return ( -
+ +
{entries.map((entry) => (
))} -
+
+ ); } diff --git a/src/components/game/tabs/AttunementsTab.tsx b/src/components/game/tabs/AttunementsTab.tsx index 6297e29..3bef068 100644 --- a/src/components/game/tabs/AttunementsTab.tsx +++ b/src/components/game/tabs/AttunementsTab.tsx @@ -6,7 +6,6 @@ import type { AttunementDef, AttunementState } from '@/lib/game/types'; import { Card, CardContent } from '@/components/ui/card'; import { Badge } from '@/components/ui/badge'; import { Progress } from '@/components/ui/progress'; -import { ScrollArea } from '@/components/ui/scroll-area'; import { DebugName } from '@/components/game/debug/debug-context'; import { fmt } from '@/lib/game/stores'; @@ -36,36 +35,83 @@ interface AttunementCardProps { function AttunementCard({ def, state }: AttunementCardProps) { const unlocked = !!state; + const isStarting = def.unlocked === true; const xpProgress = state ? getXpProgress(state) : 0; const nextXp = state ? getXpForNextLevel(state.level) : 0; + // Style tokens derived from def.color + const color = def.color; + return ( - - + + {/* Starting badge (top-right ribbon) */} + {isStarting && unlocked && ( +
+ Starting +
+ )} + + {/* Locked overlay pattern */} + {!unlocked && ( +
+ )} + + {/* Header */}
-
- {def.icon} +
+ + {def.icon} +
-

{def.name}

+

+ {def.name} +

{ATTUNEMENT_SLOT_NAMES[def.slot] ?? def.slot}

{unlocked ? ( - + Lv.{state.level} ) : ( - - Locked + + 🔒 Locked )}
{/* Description */} -

{def.desc}

+

{def.desc}

{/* XP Progress (unlocked only) */} {unlocked && state && ( @@ -76,7 +122,12 @@ function AttunementCard({ def, state }: AttunementCardProps) { {fmt(state.experience)} / {fmt(nextXp)}
- +
+
+
{state.level >= MAX_ATTUNEMENT_LEVEL && (

Maximum level reached

)} @@ -85,13 +136,19 @@ function AttunementCard({ def, state }: AttunementCardProps) { {/* Unlock condition (locked only) */} {!unlocked && def.unlockCondition && ( -
+
🔒 {def.unlockCondition}
)} {/* Details grid */} -
+
Mana Type

@@ -110,21 +167,35 @@ function AttunementCard({ def, state }: AttunementCardProps) { )}

Status -

- {state?.active ? 'Active' : unlocked ? 'Inactive' : 'Locked'} +

+ {state?.active ? '● Active' : unlocked ? '○ Inactive' : 'Locked'}

+ {/* Invoker special: pact-based note */} + {def.primaryManaType === undefined && ( +
+ Special +

+ Gains elemental mana from each guardian pact signed +

+
+ )}
{/* Capabilities */} -
+
Capabilities
{def.capabilities.map((cap) => ( {cap} @@ -140,7 +211,12 @@ function AttunementCard({ def, state }: AttunementCardProps) { {cat} @@ -174,7 +250,7 @@ export function AttunementsTab() {

-
+
{unlockedCount} /{allDefs.length} @@ -187,17 +263,15 @@ export function AttunementsTab() { {/* Attunement cards */} - -
- {allDefs.map((def) => ( - - ))} -
- +
+ {allDefs.map((def) => ( + + ))} +
); diff --git a/src/components/game/tabs/CraftingTab/EnchanterSubTab.tsx b/src/components/game/tabs/CraftingTab/EnchanterSubTab.tsx index c4db3ab..da0530d 100644 --- a/src/components/game/tabs/CraftingTab/EnchanterSubTab.tsx +++ b/src/components/game/tabs/CraftingTab/EnchanterSubTab.tsx @@ -10,6 +10,7 @@ import { } from '@/components/game/crafting'; import { useCraftingStore } from '@/lib/game/stores'; import type { DesignEffect } from '@/lib/game/types'; +import { DebugName } from '@/components/game/debug/debug-context'; type EnchanterPhase = 'design' | 'prepare' | 'apply'; @@ -45,6 +46,7 @@ export function EnchanterSubTab() { }; return ( +
{/* Phase selector */}
@@ -94,6 +96,7 @@ export function EnchanterSubTab() { /> )}
+ ); } diff --git a/src/components/game/tabs/CraftingTab/FabricatorSubTab.tsx b/src/components/game/tabs/CraftingTab/FabricatorSubTab.tsx index b728fd6..c83d741 100644 --- a/src/components/game/tabs/CraftingTab/FabricatorSubTab.tsx +++ b/src/components/game/tabs/CraftingTab/FabricatorSubTab.tsx @@ -19,6 +19,7 @@ import { MANA_TYPE_LABELS } from '@/lib/game/data/fabricator-recipe-types'; import { LOOT_DROPS, LOOT_RARITY_COLORS } from '@/lib/game/data/loot-drops'; import { useCraftingStore, useManaStore } from '@/lib/game/stores'; import type { FabricatorRecipe } from '@/lib/game/data/fabricator-recipes'; +import { DebugName } from '@/components/game/debug/debug-context'; const BRANCH_RECIPE_IDS = new Set([ 'oakStaff', 'arcanistStaff', 'battlestaff', 'arcanistCirclet', 'arcanistRobe', @@ -171,6 +172,7 @@ export function FabricatorSubTab() { }; return ( +
{/* Section toggle: Equipment vs Materials */}
@@ -375,6 +377,7 @@ export function FabricatorSubTab() {
+ ); } diff --git a/src/components/game/tabs/CraftingTab/MaterialRecipeCard.tsx b/src/components/game/tabs/CraftingTab/MaterialRecipeCard.tsx index 20ae042..894c4ab 100644 --- a/src/components/game/tabs/CraftingTab/MaterialRecipeCard.tsx +++ b/src/components/game/tabs/CraftingTab/MaterialRecipeCard.tsx @@ -7,6 +7,7 @@ import { LOOT_DROPS, LOOT_RARITY_COLORS } from '@/lib/game/data/loot-drops'; import { canCraftRecipe } from '@/lib/game/data/fabricator-recipes'; import { MANA_TYPE_LABELS } from '@/lib/game/data/fabricator-recipe-types'; import type { FabricatorRecipe } from '@/lib/game/data/fabricator-recipes'; +import { DebugName } from '@/components/game/debug/debug-context'; interface MaterialRecipeCardProps { recipe: FabricatorRecipe; @@ -31,6 +32,7 @@ export function MaterialRecipeCard({ const resultRarity = resultDrop ? LOOT_RARITY_COLORS[resultDrop.rarity] : null; return ( +
+ ); } diff --git a/src/components/game/tabs/DebugTab/AchievementDebugSection.tsx b/src/components/game/tabs/DebugTab/AchievementDebugSection.tsx index 32cf986..1bcdce2 100644 --- a/src/components/game/tabs/DebugTab/AchievementDebugSection.tsx +++ b/src/components/game/tabs/DebugTab/AchievementDebugSection.tsx @@ -5,6 +5,7 @@ import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'; import { Trophy, CheckCircle, RotateCcw } from 'lucide-react'; import { useCombatStore } from '@/lib/game/stores'; import { ACHIEVEMENTS } from '@/lib/game/data/achievements'; +import { DebugName } from '@/components/game/debug/debug-context'; export function AchievementDebugSection() { const achievements = useCombatStore((s) => s.achievements); @@ -33,50 +34,52 @@ export function AchievementDebugSection() { }; return ( - - - - - Achievement Debug - - - -
- Unlocked: {unlockedCount} / {totalCount} -
+ + + + + + Achievement Debug + + + +
+ Unlocked: {unlockedCount} / {totalCount} +
-
- - -
+
+ + +
-
- {Object.entries(ACHIEVEMENTS).map(([id, def]) => { - const isUnlocked = achievements?.unlocked?.includes(id); - return ( -
-
- {def.name} - ({def.category}) +
+ {Object.entries(ACHIEVEMENTS).map(([id, def]) => { + const isUnlocked = achievements?.unlocked?.includes(id); + return ( +
+
+ {def.name} + ({def.category}) +
+ {isUnlocked && ( + + )}
- {isUnlocked && ( - - )} -
- ); - })} -
- - + ); + })} +
+ + + ); } diff --git a/src/components/game/tabs/DebugTab/AttunementDebugSection.tsx b/src/components/game/tabs/DebugTab/AttunementDebugSection.tsx index a1a46bf..303ce3b 100644 --- a/src/components/game/tabs/DebugTab/AttunementDebugSection.tsx +++ b/src/components/game/tabs/DebugTab/AttunementDebugSection.tsx @@ -6,6 +6,7 @@ import { Sparkles, Unlock } from 'lucide-react'; import { ATTUNEMENTS_DEF } from '@/lib/game/data/attunements'; import { useAttunementStore } from '@/lib/game/stores'; import { useManaStore } from '@/lib/game/stores'; +import { DebugName } from '@/components/game/debug/debug-context'; export function AttunementDebugSection() { const attunements = useAttunementStore((s) => s.attunements); @@ -34,54 +35,56 @@ export function AttunementDebugSection() { }; return ( - - - - - Attunements - - - - - {Object.entries(ATTUNEMENTS_DEF).map(([id, def]) => { - const isActive = attunements?.[id]?.active; - const level = attunements?.[id]?.level || 1; - const xp = attunements?.[id]?.experience || 0; + + + + + + Attunements + + + + + {Object.entries(ATTUNEMENTS_DEF).map(([id, def]) => { + const isActive = attunements?.[id]?.active; + const level = attunements?.[id]?.level || 1; + const xp = attunements?.[id]?.experience || 0; - return ( -
-
- {def.icon} -
-
{def.name}
- {isActive && ( -
Lv.{level} • {xp} XP
- )} + return ( +
+
+ {def.icon} +
+
{def.name}
+ {isActive && ( +
Lv.{level} • {xp} XP
+ )} +
+
+
+ +
-
- - -
-
- ); - })} - - + ); + })} + + + ); } diff --git a/src/components/game/tabs/DebugTab/DisciplineDebugSection.tsx b/src/components/game/tabs/DebugTab/DisciplineDebugSection.tsx index 5285151..d0ba818 100644 --- a/src/components/game/tabs/DebugTab/DisciplineDebugSection.tsx +++ b/src/components/game/tabs/DebugTab/DisciplineDebugSection.tsx @@ -6,6 +6,7 @@ import { BookOpen, Plus, Pause, Play } from 'lucide-react'; import { useDisciplineStore } from '@/lib/game/stores/discipline-slice'; import { ALL_DISCIPLINES } from '@/lib/game/data/disciplines'; import { useManaStore } from '@/lib/game/stores/manaStore'; +import { DebugName } from '@/components/game/debug/debug-context'; export function DisciplineDebugSection() { const disciplines = useDisciplineStore((s) => s.disciplines); @@ -55,81 +56,83 @@ export function DisciplineDebugSection() { }; return ( - - - - - Disciplines - - - -
- - -
-
- Active: {activeIds.length} / {concurrentLimit} -
-
- {ALL_DISCIPLINES.map((def) => { - const disc = disciplines[def.id]; - const isActive = activeIds.includes(def.id); - const xp = disc?.xp || 0; + + + + + + Disciplines + + + +
+ + +
+
+ Active: {activeIds.length} / {concurrentLimit} +
+
+ {ALL_DISCIPLINES.map((def) => { + const disc = disciplines[def.id]; + const isActive = activeIds.includes(def.id); + const xp = disc?.xp || 0; - return ( -
-
-
{def.name}
-
- {isActive ? `XP: ${xp}` : 'Inactive'} + return ( +
+
+
{def.name}
+
+ {isActive ? `XP: ${xp}` : 'Inactive'} +
+
+
+ + +
-
- - - -
-
- ); - })} -
- - + ); + })} +
+ + + ); } diff --git a/src/components/game/tabs/DebugTab/ElementDebugSection.tsx b/src/components/game/tabs/DebugTab/ElementDebugSection.tsx index 0f960e7..e0aa3a0 100644 --- a/src/components/game/tabs/DebugTab/ElementDebugSection.tsx +++ b/src/components/game/tabs/DebugTab/ElementDebugSection.tsx @@ -5,6 +5,7 @@ import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'; import { Star, Lock } from 'lucide-react'; import { useManaStore } from '@/lib/game/stores'; import { ELEMENTS } from '@/lib/game/constants'; +import { DebugName } from '@/components/game/debug/debug-context'; export function ElementDebugSection() { const elements = useManaStore((s) => s.elements); @@ -29,63 +30,65 @@ export function ElementDebugSection() { }; return ( - - - - - Elemental Mana - - - -
- -
-
- {Object.entries(elements || {}).map(([id, elem]) => { - const def = ELEMENTS[id]; - return ( -
-
{def?.sym}
-
{def?.name}
-
- {elem.current}/{elem.max} + + + + + + Elemental Mana + + + +
+ +
+
+ {Object.entries(elements || {}).map(([id, elem]) => { + const def = ELEMENTS[id]; + return ( +
+
{def?.sym}
+
{def?.name}
+
+ {elem.current}/{elem.max} +
+ {!elem.unlocked && ( + + )} + {elem.unlocked && ( + + )}
- {!elem.unlocked && ( - - )} - {elem.unlocked && ( - - )} -
- ); - })} -
- - + ); + })} +
+ + + ); } diff --git a/src/components/game/tabs/DebugTab/GameStateDebugSection.tsx b/src/components/game/tabs/DebugTab/GameStateDebugSection.tsx index cb02efe..fdd50e5 100644 --- a/src/components/game/tabs/DebugTab/GameStateDebugSection.tsx +++ b/src/components/game/tabs/DebugTab/GameStateDebugSection.tsx @@ -9,7 +9,7 @@ import { Label } from '@/components/ui/label'; import { RotateCcw, AlertTriangle, Zap, Clock, Eye, } from 'lucide-react'; -import { useDebug } from '@/components/game/debug/debug-context'; +import { DebugName, useDebug } from '@/components/game/debug/debug-context'; import { useGameStore, useManaStore, useUIStore, useCombatStore } from '@/lib/game/stores'; import { computeMaxMana } from '@/lib/game/stores'; @@ -252,20 +252,22 @@ export function GameStateDebugSection() { }; return ( -
- + +
+ -
- - - - debugSetFloor?.(100)} - onResetFloorHP={() => resetFloorHP?.()} - /> +
+ + + + debugSetFloor?.(100)} + onResetFloorHP={() => resetFloorHP?.()} + /> +
-
+ ); } diff --git a/src/components/game/tabs/DebugTab/GolemDebugSection.tsx b/src/components/game/tabs/DebugTab/GolemDebugSection.tsx index 5250af0..99d9b13 100644 --- a/src/components/game/tabs/DebugTab/GolemDebugSection.tsx +++ b/src/components/game/tabs/DebugTab/GolemDebugSection.tsx @@ -5,6 +5,7 @@ import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'; import { Bug, Wand2 } from 'lucide-react'; import { useCombatStore } from '@/lib/game/stores'; import { GOLEMS_DEF } from '@/lib/game/data/golems'; +import { DebugName } from '@/components/game/debug/debug-context'; export function GolemDebugSection() { const golemancy = useCombatStore((s) => s.golemancy); @@ -29,52 +30,54 @@ export function GolemDebugSection() { }; return ( - - - - - Golem Debug - - - -
- - -
-
- Enabled: {enabledGolems.length} / {Object.keys(GOLEMS_DEF).length} -
-
- {Object.entries(GOLEMS_DEF).map(([id, def]) => { - const isEnabled = enabledGolems.includes(id); - return ( -
-
-
{def.name}
-
{def.baseManaType}
-
- + +
+
+ Enabled: {enabledGolems.length} / {Object.keys(GOLEMS_DEF).length} +
+
+ {Object.entries(GOLEMS_DEF).map(([id, def]) => { + const isEnabled = enabledGolems.includes(id); + return ( +
- {isEnabled ? 'On' : 'Off'} - -
- ); - })} -
- - +
+
{def.name}
+
{def.baseManaType}
+
+ +
+ ); + })} +
+ + + ); } diff --git a/src/components/game/tabs/DebugTab/PactDebugSection.tsx b/src/components/game/tabs/DebugTab/PactDebugSection.tsx index e2dae75..ecc543f 100644 --- a/src/components/game/tabs/DebugTab/PactDebugSection.tsx +++ b/src/components/game/tabs/DebugTab/PactDebugSection.tsx @@ -6,6 +6,7 @@ import { Bug } from 'lucide-react'; import { usePrestigeStore, useUIStore, useGameStore } from '@/lib/game/stores'; import { ELEMENTS } from '@/lib/game/constants'; import { getGuardianForFloor, getAllGuardianFloors } from '@/lib/game/data/guardian-encounters'; +import { DebugName } from '@/components/game/debug/debug-context'; // ─── Guardian Pact Row ─────────────────────────────────────────────────────── @@ -124,43 +125,45 @@ export function PactDebugSection() { }; return ( - - - - - Pact Debug - - - -
-
- - -
+ + + + + + Pact Debug + + + +
+
+ + +
-
- {guardianFloors.map((floor) => ( - forcePact(floor)} - onRemove={() => removePactHandler(floor)} - /> - ))} -
+
+ {guardianFloors.map((floor) => ( + forcePact(floor)} + onRemove={() => removePactHandler(floor)} + /> + ))} +
-
- Signed Pacts: {signedPacts.length} | - Max Pacts: {1 + (prestigeUpgrades?.pactCapacity || 0)} +
+ Signed Pacts: {signedPacts.length} | + Max Pacts: {1 + (prestigeUpgrades?.pactCapacity || 0)} +
-
- - + + + ); } diff --git a/src/components/game/tabs/DebugTab/SpireDebugSection.tsx b/src/components/game/tabs/DebugTab/SpireDebugSection.tsx index 722829e..639b696 100644 --- a/src/components/game/tabs/DebugTab/SpireDebugSection.tsx +++ b/src/components/game/tabs/DebugTab/SpireDebugSection.tsx @@ -6,6 +6,7 @@ import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'; import { Input } from '@/components/ui/input'; import { Castle, ArrowUp, Eye } from 'lucide-react'; import { useCombatStore } from '@/lib/game/stores'; +import { DebugName } from '@/components/game/debug/debug-context'; export function SpireDebugSection() { const [floorInput, setFloorInput] = useState('50'); @@ -39,67 +40,69 @@ export function SpireDebugSection() { }; return ( - - - - - Spire Debug - - - -
- Current Floor: {currentFloor} | Max Reached: {maxFloorReached} | Spire Mode: {spireMode ? 'ON' : 'OFF'} -
- -
-
- - setFloorInput(e.target.value)} - className="h-8" - /> + + + + + + Spire Debug + + + +
+ Current Floor: {currentFloor} | Max Reached: {maxFloorReached} | Spire Mode: {spireMode ? 'ON' : 'OFF'}
- -
-
- - -
- -
- {[10, 25, 50, 75, 100].map((f) => ( - - ))} -
- - +
+ +
+ + +
+ +
+ {[10, 25, 50, 75, 100].map((f) => ( + + ))} +
+ + + ); } diff --git a/src/components/game/tabs/EquipmentTab/EquipmentEffectsSummary.tsx b/src/components/game/tabs/EquipmentTab/EquipmentEffectsSummary.tsx index 50af690..8a6ad22 100644 --- a/src/components/game/tabs/EquipmentTab/EquipmentEffectsSummary.tsx +++ b/src/components/game/tabs/EquipmentTab/EquipmentEffectsSummary.tsx @@ -1,5 +1,6 @@ 'use client'; +import { DebugName } from '@/components/game/debug/debug-context'; import { computeEquipmentEffects } from '@/lib/game/effects'; import type { EquipmentInstance } from '@/lib/game/types'; @@ -43,6 +44,7 @@ export function EquipmentEffectsSummary({ equipmentInstances, equippedInstances } return ( +

Equipment Effects

@@ -89,5 +91,6 @@ export function EquipmentEffectsSummary({ equipmentInstances, equippedInstances
)}
+ ); } diff --git a/src/components/game/tabs/EquipmentTab/EquipmentSlotGrid.tsx b/src/components/game/tabs/EquipmentTab/EquipmentSlotGrid.tsx index 23da791..098d0ea 100644 --- a/src/components/game/tabs/EquipmentTab/EquipmentSlotGrid.tsx +++ b/src/components/game/tabs/EquipmentTab/EquipmentSlotGrid.tsx @@ -5,6 +5,7 @@ import type { EquipmentInstance, EquipmentSlot } from '@/lib/game/types'; import { EQUIPMENT_TYPES, SLOT_NAMES } from '@/lib/game/data/equipment'; import { RARITY_CSS_VAR } from '@/components/game/LootInventory/types'; import { CATEGORY_ICONS } from '@/components/game/LootInventory/icons'; +import { DebugName } from '@/components/game/debug/debug-context'; import { ActionButton } from '@/components/ui/action-button'; interface EquipmentSlotGridProps { @@ -17,6 +18,7 @@ const SLOTS: EquipmentSlot[] = ['mainHand', 'offHand', 'head', 'body', 'hands', export function EquipmentSlotGrid({ equippedInstances, equipmentInstances, onUnequip }: EquipmentSlotGridProps) { return ( +
{SLOTS.map((slot) => { const instanceId = equippedInstances[slot]; @@ -75,5 +77,6 @@ export function EquipmentSlotGrid({ equippedInstances, equipmentInstances, onUne ); })}
+ ); } diff --git a/src/components/game/tabs/EquipmentTab/InventoryList.tsx b/src/components/game/tabs/EquipmentTab/InventoryList.tsx index 466de65..4c7d209 100644 --- a/src/components/game/tabs/EquipmentTab/InventoryList.tsx +++ b/src/components/game/tabs/EquipmentTab/InventoryList.tsx @@ -7,6 +7,7 @@ import { EQUIPMENT_TYPES, getValidSlotsForEquipmentType } from '@/lib/game/data/ import { RARITY_CSS_VAR, RARITY_GLOW_CSS_VAR } from '@/components/game/LootInventory/types'; import { CATEGORY_ICONS } from '@/components/game/LootInventory/icons'; import { ActionButton } from '@/components/ui/action-button'; +import { DebugName } from '@/components/game/debug/debug-context'; import { AlertDialog, AlertDialogAction, @@ -38,6 +39,7 @@ export function InventoryList({ inventoryItems, equippedInstances, onEquip, onDe } return ( +
{inventoryItems.map(([instanceId, instance]) => { const type = EQUIPMENT_TYPES[instance.typeId]; @@ -131,5 +133,6 @@ export function InventoryList({ inventoryItems, equippedInstances, onEquip, onDe ); })}
+ ); } diff --git a/src/components/game/tabs/SpellsTab.tsx b/src/components/game/tabs/SpellsTab.tsx index c559607..0713e16 100644 --- a/src/components/game/tabs/SpellsTab.tsx +++ b/src/components/game/tabs/SpellsTab.tsx @@ -6,6 +6,7 @@ import { ELEMENTS, SPELLS_DEF } from '@/lib/game/constants'; import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'; import { Badge } from '@/components/ui/badge'; import { Button } from '@/components/ui/button'; +import { DebugName } from '@/components/game/debug/debug-context'; // Format spell cost for display function formatSpellCost(cost: { type: 'raw' | 'element'; element?: string; amount: number }): string { @@ -34,7 +35,8 @@ export function SpellsTab() { const spellTiers = [0, 1, 2, 3, 4]; return ( -
+ +
{spellTiers.map(tier => { const spellsInTier = Object.entries(SPELLS_DEF).filter(([, def]) => def.tier === tier); if (spellsInTier.length === 0) return null; @@ -121,7 +123,8 @@ export function SpellsTab() {
); })} -
+
+ ); } diff --git a/src/components/game/tabs/SpireCombatPage/RoomDisplay.tsx b/src/components/game/tabs/SpireCombatPage/RoomDisplay.tsx index b583392..8d348db 100644 --- a/src/components/game/tabs/SpireCombatPage/RoomDisplay.tsx +++ b/src/components/game/tabs/SpireCombatPage/RoomDisplay.tsx @@ -7,6 +7,7 @@ import { Progress } from '@/components/ui/progress'; import { getSpireRoomTypeDisplay } from '@/lib/game/utils/spire-utils'; import { ELEMENTS } from '@/lib/game/constants'; import { fmt } from '@/lib/game/stores'; +import { DebugName } from '@/components/game/debug/debug-context'; interface RoomDisplayProps { floorState: FloorState; @@ -179,6 +180,7 @@ export function RoomDisplay({ floorState }: RoomDisplayProps) { const isGuardian = floorState.roomType === 'guardian'; return ( + @@ -196,5 +198,6 @@ export function RoomDisplay({ floorState }: RoomDisplayProps) { )} + ); } diff --git a/src/components/game/tabs/SpireCombatPage/SpireActivityLog.tsx b/src/components/game/tabs/SpireCombatPage/SpireActivityLog.tsx index be5d73e..6755fc6 100644 --- a/src/components/game/tabs/SpireCombatPage/SpireActivityLog.tsx +++ b/src/components/game/tabs/SpireCombatPage/SpireActivityLog.tsx @@ -3,6 +3,7 @@ import type { ActivityLogEntry } from '@/lib/game/types'; import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'; import { ScrollArea } from '@/components/ui/scroll-area'; +import { DebugName } from '@/components/game/debug/debug-context'; interface SpireActivityLogProps { activityLog: ActivityLogEntry[]; @@ -13,6 +14,7 @@ export function SpireActivityLog({ activityLog, maxEntries = 30 }: SpireActivity const entries = activityLog.slice(0, maxEntries); return ( + 📜 Activity Log @@ -39,5 +41,6 @@ export function SpireActivityLog({ activityLog, maxEntries = 30 }: SpireActivity + ); } diff --git a/src/components/game/tabs/SpireCombatPage/SpireCombatControls.tsx b/src/components/game/tabs/SpireCombatPage/SpireCombatControls.tsx index d9280ac..891b164 100644 --- a/src/components/game/tabs/SpireCombatPage/SpireCombatControls.tsx +++ b/src/components/game/tabs/SpireCombatPage/SpireCombatControls.tsx @@ -5,6 +5,7 @@ import { SPELLS_DEF, ELEMENTS } from '@/lib/game/constants'; import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'; import { Progress } from '@/components/ui/progress'; import { GOLEMS_DEF } from '@/lib/game/data/golems'; +import { DebugName } from '@/components/game/debug/debug-context'; interface SpireCombatControlsProps { castProgress: number; @@ -31,6 +32,7 @@ export function SpireCombatControls({ castProgress }: SpireCombatControlsProps) const summonedGolems = golemancy.summonedGolems || []; return ( +
{/* Active Spell Panel */} @@ -127,5 +129,6 @@ export function SpireCombatControls({ castProgress }: SpireCombatControlsProps)
+ ); } diff --git a/src/components/game/tabs/SpireCombatPage/SpireCombatPage.tsx b/src/components/game/tabs/SpireCombatPage/SpireCombatPage.tsx index 186ccf7..24d6f7f 100644 --- a/src/components/game/tabs/SpireCombatPage/SpireCombatPage.tsx +++ b/src/components/game/tabs/SpireCombatPage/SpireCombatPage.tsx @@ -13,6 +13,7 @@ import { RoomDisplay } from './RoomDisplay'; import { SpireCombatControls } from './SpireCombatControls'; import { SpireActivityLog } from './SpireActivityLog'; import { SpireManaDisplay } from './SpireManaDisplay'; +import { DebugName } from '@/components/game/debug/debug-context'; // ─── Derived Stats Hook ────────────────────────────────────────────────────── @@ -164,6 +165,7 @@ export function SpireCombatPage() { }; return ( +
@@ -206,5 +208,6 @@ export function SpireCombatPage() {
+ ); } diff --git a/src/components/game/tabs/SpireCombatPage/SpireHeader.tsx b/src/components/game/tabs/SpireCombatPage/SpireHeader.tsx index 4d06692..7447e01 100644 --- a/src/components/game/tabs/SpireCombatPage/SpireHeader.tsx +++ b/src/components/game/tabs/SpireCombatPage/SpireHeader.tsx @@ -6,6 +6,7 @@ import { Card, CardContent } from '@/components/ui/card'; import { Progress } from '@/components/ui/progress'; import { Mountain, ArrowUp, ArrowDown, LogOut } from 'lucide-react'; import { getGuardianForFloor, isGuardianFloor } from '@/lib/game/data/guardian-encounters'; +import { DebugName } from '@/components/game/debug/debug-context'; interface SpireHeaderProps { currentFloor: number; @@ -39,6 +40,7 @@ export function SpireHeader({ const roomProgress = totalRooms > 0 ? ((roomsCleared) / totalRooms) * 100 : 0; return ( + {/* Top row: Floor info + controls */} @@ -123,5 +125,6 @@ export function SpireHeader({
+ ); } diff --git a/src/components/game/tabs/SpireCombatPage/SpireManaDisplay.tsx b/src/components/game/tabs/SpireCombatPage/SpireManaDisplay.tsx index ae8e102..f61fad2 100644 --- a/src/components/game/tabs/SpireCombatPage/SpireManaDisplay.tsx +++ b/src/components/game/tabs/SpireCombatPage/SpireManaDisplay.tsx @@ -4,6 +4,7 @@ import { useManaStore, fmt, fmtDec } from '@/lib/game/stores'; import { Card, CardContent } from '@/components/ui/card'; import { Progress } from '@/components/ui/progress'; import { ELEMENTS } from '@/lib/game/constants'; +import { DebugName } from '@/components/game/debug/debug-context'; interface SpireManaDisplayProps { maxMana: number; @@ -22,6 +23,7 @@ export function SpireManaDisplay({ maxMana, effectiveRegen }: SpireManaDisplayPr const manaPercent = maxMana > 0 ? (rawMana / maxMana) * 100 : 0; return ( + {/* Raw Mana */} @@ -68,5 +70,6 @@ export function SpireManaDisplay({ maxMana, effectiveRegen }: SpireManaDisplayPr )} + ); } diff --git a/src/components/game/tabs/StatsTab.tsx b/src/components/game/tabs/StatsTab.tsx index ea194d2..ba800a3 100644 --- a/src/components/game/tabs/StatsTab.tsx +++ b/src/components/game/tabs/StatsTab.tsx @@ -10,6 +10,7 @@ import { StudyStatsSection } from './StatsTab/StudyStatsSection'; import { ElementStatsSection } from './StatsTab/ElementStatsSection'; import { LoopStatsSection } from './StatsTab/LoopStatsSection'; import { DisciplineStatsSection } from './StatsTab/DisciplineStatsSection'; +import { DebugName } from '@/components/game/debug/debug-context'; export function StatsTab() { const prestigeUpgrades = usePrestigeStore((s) => s.prestigeUpgrades); @@ -23,7 +24,8 @@ export function StatsTab() { const elemMax = 10 + (prestigeUpgrades.elementalAttune || 0) * 25; return ( -
+ +
-
+
+ ); } diff --git a/src/components/game/tabs/StatsTab/CombatStatsSection.tsx b/src/components/game/tabs/StatsTab/CombatStatsSection.tsx index 0e11f01..06f0194 100644 --- a/src/components/game/tabs/StatsTab/CombatStatsSection.tsx +++ b/src/components/game/tabs/StatsTab/CombatStatsSection.tsx @@ -1,6 +1,7 @@ 'use client'; import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'; +import { DebugName } from '@/components/game/debug/debug-context'; import { Swords } from 'lucide-react'; import { fmt, fmtDec } from '@/lib/game/stores'; import type { SpellDef } from '@/lib/game/types'; @@ -12,6 +13,7 @@ interface CombatStatsSectionProps { export function CombatStatsSection({ activeSpellDef, pactMultiplier }: CombatStatsSectionProps) { return ( + @@ -44,5 +46,6 @@ export function CombatStatsSection({ activeSpellDef, pactMultiplier }: CombatSta
+ ); } diff --git a/src/components/game/tabs/StatsTab/DisciplineStatsSection.tsx b/src/components/game/tabs/StatsTab/DisciplineStatsSection.tsx index 82d8776..28810e0 100644 --- a/src/components/game/tabs/StatsTab/DisciplineStatsSection.tsx +++ b/src/components/game/tabs/StatsTab/DisciplineStatsSection.tsx @@ -1,6 +1,7 @@ 'use client'; import { useMemo } from 'react'; +import { DebugName } from '@/components/game/debug/debug-context'; import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'; import { Brain } from 'lucide-react'; import { useDisciplineStore } from '@/lib/game/stores/discipline-slice'; @@ -27,6 +28,7 @@ export function DisciplineStatsSection({ disciplineEffects }: DisciplineStatsSec if (disciplineEntries.length === 0) return null; return ( + @@ -68,5 +70,6 @@ export function DisciplineStatsSection({ disciplineEffects }: DisciplineStatsSec
+ ); } diff --git a/src/components/game/tabs/StatsTab/ElementStatsSection.tsx b/src/components/game/tabs/StatsTab/ElementStatsSection.tsx index 3b99aac..9fa0a86 100644 --- a/src/components/game/tabs/StatsTab/ElementStatsSection.tsx +++ b/src/components/game/tabs/StatsTab/ElementStatsSection.tsx @@ -1,6 +1,7 @@ 'use client'; import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'; +import { DebugName } from '@/components/game/debug/debug-context'; import { Separator } from '@/components/ui/separator'; import { FlaskConical } from 'lucide-react'; import { ELEMENTS } from '@/lib/game/constants'; @@ -16,6 +17,7 @@ export function ElementStatsSection({ elemMax }: ElementStatsSectionProps) { const elements = useManaStore((s) => s.elements); return ( + @@ -59,5 +61,6 @@ export function ElementStatsSection({ elemMax }: ElementStatsSectionProps) {
+ ); } diff --git a/src/components/game/tabs/StatsTab/LoopStatsSection.tsx b/src/components/game/tabs/StatsTab/LoopStatsSection.tsx index 8ab1d0f..191a7d6 100644 --- a/src/components/game/tabs/StatsTab/LoopStatsSection.tsx +++ b/src/components/game/tabs/StatsTab/LoopStatsSection.tsx @@ -1,6 +1,7 @@ 'use client'; import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'; +import { DebugName } from '@/components/game/debug/debug-context'; import { Separator } from '@/components/ui/separator'; import { RotateCcw } from 'lucide-react'; import { fmt } from '@/lib/game/stores'; @@ -18,6 +19,7 @@ export function LoopStatsSection() { const spellsLearned = Object.values(spells || {}).filter((s: SpellState) => s.learned).length; return ( + @@ -57,5 +59,6 @@ export function LoopStatsSection() {
+ ); } diff --git a/src/components/game/tabs/StatsTab/ManaStatsSection.tsx b/src/components/game/tabs/StatsTab/ManaStatsSection.tsx index 40b78ec..7d130ea 100644 --- a/src/components/game/tabs/StatsTab/ManaStatsSection.tsx +++ b/src/components/game/tabs/StatsTab/ManaStatsSection.tsx @@ -1,6 +1,7 @@ 'use client'; import { fmt, fmtDec } from '@/lib/game/stores'; +import { DebugName } from '@/components/game/debug/debug-context'; import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'; import { Droplet } from 'lucide-react'; import type { ComputedEffects } from '@/lib/game/effects/upgrade-effects.types'; @@ -51,6 +52,7 @@ export function ManaStatsSection({ stats, elemMax }: ManaStatsSectionProps) { } = stats; return ( + @@ -206,5 +208,6 @@ export function ManaStatsSection({ stats, elemMax }: ManaStatsSectionProps) {
+ ); } diff --git a/src/components/game/tabs/StatsTab/PactStatusSection.tsx b/src/components/game/tabs/StatsTab/PactStatusSection.tsx index 9919d7c..027dad7 100644 --- a/src/components/game/tabs/StatsTab/PactStatusSection.tsx +++ b/src/components/game/tabs/StatsTab/PactStatusSection.tsx @@ -1,6 +1,7 @@ 'use client'; import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'; +import { DebugName } from '@/components/game/debug/debug-context'; import { Trophy } from 'lucide-react'; import { fmtDec } from '@/lib/game/stores'; import { ELEMENTS } from '@/lib/game/constants'; @@ -19,6 +20,7 @@ export function PactStatusSection({ pactMultiplier, pactInsightMultiplier }: Pac const pactInterferenceMitigation = prestigeUpgrades?.pactInterferenceMitigation || 0; return ( + @@ -74,5 +76,6 @@ export function PactStatusSection({ pactMultiplier, pactInsightMultiplier }: Pac
+ ); } \ No newline at end of file diff --git a/src/components/game/tabs/StatsTab/StudyStatsSection.tsx b/src/components/game/tabs/StatsTab/StudyStatsSection.tsx index d119494..2ecb542 100644 --- a/src/components/game/tabs/StatsTab/StudyStatsSection.tsx +++ b/src/components/game/tabs/StatsTab/StudyStatsSection.tsx @@ -1,6 +1,7 @@ 'use client'; import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'; +import { DebugName } from '@/components/game/debug/debug-context'; import { BookOpen } from 'lucide-react'; import { fmtDec } from '@/lib/game/stores'; @@ -11,6 +12,7 @@ interface StudyStatsSectionProps { export function StudyStatsSection({ studySpeedMult, studyCostMult }: StudyStatsSectionProps) { return ( + @@ -41,5 +43,6 @@ export function StudyStatsSection({ studySpeedMult, studyCostMult }: StudyStatsS
+ ); } diff --git a/src/components/game/tabs/guardian-pacts-components.tsx b/src/components/game/tabs/guardian-pacts-components.tsx index 2715d7d..9428454 100644 --- a/src/components/game/tabs/guardian-pacts-components.tsx +++ b/src/components/game/tabs/guardian-pacts-components.tsx @@ -7,6 +7,7 @@ import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'; import { Badge } from '@/components/ui/badge'; import { Shield, Swords, Clock, Sparkles, Check, Lock, ChevronRight } from 'lucide-react'; import clsx from 'clsx'; +import { DebugName } from '@/components/game/debug/debug-context'; // ─── Types ─────────────────────────────────────────────────────────────────── @@ -81,14 +82,15 @@ export const GuardianCard: React.FC = React.memo(({ : elemDisplays[0]?.name ?? guardian.element; return ( - + +
@@ -141,7 +143,8 @@ export const GuardianCard: React.FC = React.memo(({ /> )} - + + ); });