feat(dashboard): add quest widget + fix 4-tab header layout
Quest Widget Integration: - Created questsWidget.js with Main/Optional quest sub-tabs - Added dedicated Quests tab (4th tab after Inventory) - Registered quest widget in dashboardIntegration.js - Widget features: inline editing, add/remove quests, contenteditable - Fixed tab switching to use inline re-rendering (not full widget render) Header Layout Fixes (4+ Tabs): - Changed header flex-wrap from wrap to nowrap (prevents button wrapping) - Added icon-only mode for 4+ tabs (disables hover expansion) - Tab count detection in renderTabs() adds rpg-tabs-icon-only class - Prevents layout breaking when tabs expand on hover Technical Details: - Quest widget follows inventory widget pattern (sub-tabs, per-instance state) - Split event handlers: attachQuestHandlers (tabs) + attachQuestContentHandlers (buttons) - Tab switching updates innerHTML inline and re-attaches content handlers - Default size: 2w × 5h, category: 'scene' Benefits: - Quest tracking fully integrated with Dashboard v2 drag/drop - No header wrapping issues with 4 tabs - Cleaner icon-only UX when space is constrained - Horizontal scrolling handles overflow gracefully
This commit is contained in:
@@ -178,6 +178,26 @@ export function generateDefaultDashboard() {
|
||||
}
|
||||
}
|
||||
]
|
||||
},
|
||||
// Tab 4: Quests (Full tab for quest system)
|
||||
{
|
||||
id: 'tab-quests',
|
||||
name: 'Quests',
|
||||
icon: 'fa-solid fa-scroll',
|
||||
order: 3,
|
||||
widgets: [
|
||||
{
|
||||
id: 'widget-quests',
|
||||
type: 'quests',
|
||||
x: 0,
|
||||
y: 0,
|
||||
w: 2,
|
||||
h: 5,
|
||||
config: {
|
||||
defaultSubTab: 'main'
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
],
|
||||
|
||||
|
||||
Reference in New Issue
Block a user