"use strict";
/**
 * useThemeManager hook
 *
 * Custom hook to manage theme settings with persistence
 */
Object.defineProperty(exports, "__esModule", { value: true });
exports.useThemeManager = useThemeManager;
const react_1 = require("react");
const useLayoutPersistence_js_1 = require("./useLayoutPersistence.js");
/**
 * Custom hook to manage theme settings with persistence
 * @param {string} defaultTheme - The default theme to use if none is stored
 * @returns {Object} Theme management functions and current theme
 *
 * @example
 * const { theme, setTheme, toggleTheme, isTheme } = useThemeManager('light');
 *
 * // Check if current theme is dark
 * if (isTheme('dark')) {
 *   // Apply dark-specific styles
 * }
 *
 * // Toggle between light and dark
 * <button onClick={toggleTheme}>Toggle theme</button>
 */
function useThemeManager(defaultTheme = 'light') {
    // Use layout persistence to store theme preference
    const [theme, setThemeValue] = (0, useLayoutPersistence_js_1.useLayoutPersistence)('theme', defaultTheme);
    // Function to set the theme in both state and DOM
    const setTheme = (0, react_1.useCallback)((newTheme) => {
        setThemeValue(newTheme);
        // Apply theme class to document
        if (typeof document !== 'undefined') {
            document.documentElement.setAttribute('data-theme', newTheme);
            // Add/remove dark class for convenience
            if (newTheme === 'dark') {
                document.documentElement.classList.add('dark-theme');
            }
            else {
                document.documentElement.classList.remove('dark-theme');
            }
        }
    }, [setThemeValue]);
    // Toggle between light and dark themes
    const toggleTheme = (0, react_1.useCallback)(() => {
        setTheme(theme === 'light' ? 'dark' : 'light');
    }, [theme, setTheme]);
    // Function to check if current theme matches a given theme
    const isTheme = (0, react_1.useCallback)((themeName) => {
        return theme === themeName;
    }, [theme]);
    // Initialize theme on mount
    (0, react_1.useEffect)(() => {
        setTheme(theme);
    }, []);
    return {
        theme,
        setTheme,
        toggleTheme,
        isTheme,
        isDark: theme === 'dark',
        isLight: theme === 'light'
    };
}
exports.default = useThemeManager;
//# sourceMappingURL=useThemeManager.js.map