����
������������������������������������
/**
 * Main Application JavaScript
 * Initializes all components and sets up global functionality
 */

import DataGrid from './components/data-grid.js';

// Initialize components when DOM is ready
document.addEventListener('DOMContentLoaded', () => {
    // Initialize Data Grid
    const dataGrid = new DataGrid({
        tableId: 'mainBudgetTable',
        // Add any additional options here
    });

    // Set up global theme
    initializeTheme();

    // Set up navigation
    initializeNavigation();
});

/**
 * Initialize theme-related functionality
 */
function initializeTheme() {
    // Define theme colors
    const theme = {
        primary: '#000000',
        primaryHover: '#1a1a1a',
        primaryLight: 'rgba(0, 0, 0, 0.05)',
        textDark: '#000000',
        textLight: '#ffffff'
    };

    // Apply theme colors to CSS variables
    Object.entries(theme).forEach(([key, value]) => {
        document.documentElement.style.setProperty(`--${key}`, value);
    });
}

/**
 * Initialize navigation functionality
 */
function initializeNavigation() {
    // Initialize Bootstrap tabs
    const triggerTabList = [].slice.call(document.querySelectorAll('#mainTabs button'));
    triggerTabList.forEach(function(triggerEl) {
        const tabTrigger = new bootstrap.Tab(triggerEl);
        
        triggerEl.addEventListener('click', function(event) {
            event.preventDefault();
            tabTrigger.show();
        });
    });
    
    // Ensure the first tab is shown by default
    const firstTab = document.querySelector('#mainTabs button.nav-link');
    if (firstTab) {
        const tab = new bootstrap.Tab(firstTab);
        tab.show();
    }
}

// Export any necessary functions or objects
export {
    initializeTheme,
    initializeNavigation
};