Auto-open stat block panel when adding first bestiary creature

When the side panel is in its initial closed state (not user-collapsed),
adding a combatant from the bestiary now opens the panel to show its
stat block. This makes the panel discoverable without overriding a
deliberate collapse.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

apps/web/src/App.tsx

@@ -128,9 +128,12 @@ export function App() {
 
 	const handleAddFromBestiary = useCallback(
 		(result: SearchResult) => {
-			addFromBestiary(result);
+			const creatureId = addFromBestiary(result);
+			if (creatureId && sidePanel.panelView.mode === "closed") {
+				sidePanel.showCreature(creatureId);
+			}
 		},
-		[addFromBestiary],
+		[addFromBestiary, sidePanel.panelView.mode, sidePanel.showCreature],
 	);
 
 	const handleCombatantStatBlock = useCallback(

apps/web/src/hooks/__tests__/use-encounter.test.ts

@@ -137,7 +137,9 @@ describe("useEncounter", () => {
 			type: "humanoid",
 		};
 
-		act(() => result.current.addFromBestiary(entry));
+		act(() => {
+			result.current.addFromBestiary(entry);
+		});
 
 		expect(result.current.hasCreatureCombatants).toBe(true);
 		expect(result.current.canRollAllInitiative).toBe(true);
@@ -158,7 +160,9 @@ describe("useEncounter", () => {
 			type: "humanoid",
 		};
 
-		act(() => result.current.addFromBestiary(entry));
+		act(() => {
+			result.current.addFromBestiary(entry);
+		});
 
 		const combatant = result.current.encounter.combatants[0];
 		expect(combatant.name).toBe("Goblin");
@@ -183,8 +187,12 @@ describe("useEncounter", () => {
 			type: "humanoid",
 		};
 
-		act(() => result.current.addFromBestiary(entry));
+		act(() => {
-		act(() => result.current.addFromBestiary(entry));
+			result.current.addFromBestiary(entry);
+		});
+		act(() => {
+			result.current.addFromBestiary(entry);
+		});
 
 		const names = result.current.encounter.combatants.map((c) => c.name);
 		expect(names).toContain("Goblin 1");

apps/web/src/hooks/use-encounter.ts

@@ -17,6 +17,7 @@ import type {
 	BestiaryIndexEntry,
 	CombatantId,
 	ConditionId,
+	CreatureId,
 	DomainEvent,
 	Encounter,
 	PlayerCharacter,
@@ -265,7 +266,7 @@ export function useEncounter() {
 	}, [makeStore]);
 
 	const addFromBestiary = useCallback(
-		(entry: BestiaryIndexEntry) => {
+		(entry: BestiaryIndexEntry): CreatureId | null => {
 			const store = makeStore();
 			const existingNames = store.get().combatants.map((c) => c.name);
 			const { newName, renames } = resolveCreatureName(
@@ -284,7 +285,7 @@ export function useEncounter() {
 			// Add combatant with resolved name
 			const id = combatantId(`c-${++nextId.current}`);
 			const addResult = addCombatantUseCase(makeStore(), id, newName);
-			if (isDomainError(addResult)) return;
+			if (isDomainError(addResult)) return null;
 
 			// Set HP
 			const hpResult = setHpUseCase(makeStore(), id, entry.hp);
@@ -317,6 +318,8 @@ export function useEncounter() {
 			});
 
 			setEvents((prev) => [...prev, ...addResult]);
+
+			return cId;
 		},
 		[makeStore],
 	);