fix: update Scene tab widgets for proper sizing on reset layout

**Problem:**
Reset Layout button was shrinking Scene tab widgets (recentEvents and
presentCharacters) because widget definitions had defaultSize: 2x2 but
defaultLayout.js expected larger sizes (2x4 for characters).

**Changes:**

**presentCharactersWidget.js:**
- Change defaultSize from 2x2 to column-aware function
- Returns 2x4 at all column counts (taller for better card display)
- Update maxAutoSize to allow expansion to 3x5 on wide screens

**recentEventsWidget (infoBoxWidgets.js):**
- Change defaultSize to column-aware function
- Returns 2x2 at 2 columns, 3x2 at 3+ columns (full width)
- Add maxAutoSize for expansion capability

**defaultLayout.js Scene Tab:**
- Update all widgets to use 3-column width for desktop
- sceneInfo: 3x3 (was 2x2), positioned at y:0
- recentEvents: 3x2 (was 2x2), positioned at y:3 (below sceneInfo)
- presentCharacters: 3x4 (was 2x4), positioned at y:5 (below events)

**Result:**
- Scene tab widgets now properly sized on reset (no more shrinking)
- Widgets stack correctly without overlapping
- Full width utilization on wider screens (3 columns)
- Consistent behavior with Status tab responsive sizing
This commit is contained in:
Lucas 'Paperboy' Rose-Winters
2025-11-06 20:45:24 +11:00
parent 8dc07a938a
commit 53a1eb1469
3 changed files with 36 additions and 12 deletions
@@ -276,8 +276,20 @@ export function registerPresentCharactersWidget(registry, dependencies) {
description: 'Character cards with avatars, traits, and relationships',
category: 'scene',
minSize: { w: 2, h: 2 },
defaultSize: { w: 2, h: 2 }, // Compact size fits both mobile and desktop viewports
maxAutoSize: { w: 4, h: 5 }, // Max size for auto-arrange expansion (supports up to 4-col on large displays)
// Column-aware sizing: taller for better card display
defaultSize: (columns) => {
if (columns <= 2) {
return { w: 2, h: 4 }; // Mobile: 2 cols wide (full), 4 rows tall
}
return { w: 2, h: 4 }; // Desktop: 2 cols wide, 4 rows tall
},
// Column-aware max size: can expand on very wide screens
maxAutoSize: (columns) => {
if (columns <= 2) {
return { w: 2, h: 5 };
}
return { w: 3, h: 5 }; // Can expand to 3 cols wide on 4-col displays
},
requiresSchema: false,
render(container, config = {}) {