mirror of
https://github.com/LGUG2Z/komorebi.git
synced 2026-11-14 21:04:04 +01:00
c6835ddbb280a7bc2892dcf400615a2f7731e6f7
Implement a modal popup system for viewing type definitions without leaving the current context, with browser-like back/forward navigation. Modal UI Components: - Full-screen overlay with centered modal dialog - Header with title, close button, and navigation controls - Scrollable content area for type definition - Back (←) and forward (→) navigation buttons - Visual disabled state for navigation at history bounds Navigation Features: - Click any type reference in root schema to open in modal - Click type references within modal to navigate deeper - Keyboard shortcuts: Alt+← (back), Alt+→ (forward), Escape (close) - History tracking with array and index pointer - History resets on modal close JavaScript Implementation: - `openTypeModal(typeName, addToHistory)`: Open/navigate to type - `showType(typeName)`: Clone and display type definition content - `navigateHistory(direction)`: Handle back/forward navigation - `closeModal()`: Close modal and reset state - `updateNavButtons()`: Enable/disable nav buttons based on position CSS Styling (102 lines added): - `.modal-overlay`: Fixed positioning with semi-transparent background - `.modal`: Centered container with max dimensions and shadow - `.modal-header`: Flex layout for nav, title, and close button - `.modal-nav-btn`: Styled navigation buttons with disabled state - `.modal-content`: Scrollable content with padding Identifier Updates: - Add modal-related IDs and classes to identifiers.rs - New ID: `modal-overlay` - New classes: modal, modal-active, modal-header, modal-title, modal-close, modal-content, modal-nav, modal-nav-btn, disabled