import type { SidebarDimensions, SidebarAnimations, SidebarCollapseMode, SidebarHideOpensBehavior, SidebarVisualStyle } from "./Sidebar.types";
import { SidebarLayoutBehaviour } from "./Sidebar.types";
/**
 * Configuración para el generador de estilos
 * @interface
 */
interface StyleGeneratorConfig {
    dimensions: SidebarDimensions;
    animations: SidebarAnimations;
    collapseMode: SidebarCollapseMode;
    hideOpensBehavior: SidebarHideOpensBehavior;
    layoutBehaviour: SidebarLayoutBehaviour;
    visualStyle: SidebarVisualStyle;
}
/**
 * Genera los estilos CSS del sidebar usando CSS-in-JS y tokens de mks-ui
 *
 * @description
 * Función que genera todo el CSS necesario para el sidebar,
 * utilizando los tokens CSS de mks-ui definidos en index.css:
 *
 * **Tokens utilizados:**
 * - `--sidebar`: Color de fondo
 * - `--sidebar-foreground`: Color de texto
 * - `--sidebar-primary`: Color primario (indicador, elementos activos)
 * - `--sidebar-accent`: Color de hover y estados secundarios
 * - `--sidebar-border`: Color de bordes
 * - `--sidebar-ring`: Color de focus ring (accesibilidad)
 *
 * Usa CSS Layers para organización y control de especificidad:
 * - sidebar-base: Variables y estilos base
 * - sidebar-states: Estados (:checked, :hover, etc.)
 * - sidebar-animations: Transiciones y animaciones
 *
 * @param {StyleGeneratorConfig} config - Configuración de dimensiones y animaciones
 * @returns {string} String con el CSS completo
 *
 * @example
 * ```tsx
 * const styles = generateSidebarStyles({
 *   dimensions: DEFAULT_DIMENSIONS,
 *   animations: DEFAULT_ANIMATIONS,
 *   collapseMode: SidebarCollapseMode.COLLAPSE,
 *   hideOpensBehavior: SidebarHideOpensBehavior.COLLAPSED
 * })
 *
 * <style dangerouslySetInnerHTML={{ __html: styles }} />
 * ```
 *
 * @note
 * Los colores se configuran vía CSS custom properties (--sidebar-bg, etc.)
 * que se mapean a los tokens de mks-ui para soporte automático de dark/light mode.
 */
export declare function generateSidebarStyles({ dimensions, animations, collapseMode, hideOpensBehavior, layoutBehaviour, visualStyle, }: StyleGeneratorConfig): string;
/**
 * Genera estilos para el indicador visual usando tokens CSS
 *
 * @description
 * Función auxiliar para generar estilos dinámicos del indicador.
 * Útil para aplicar estilos inline con estado reactivo.
 *
 * Utiliza el token `--sidebar-primary` para el color del indicador,
 * asegurando consistencia con el theme del sidebar.
 *
 * @param {boolean} isVisible - Si el indicador está visible
 * @returns {React.CSSProperties} Objeto de estilos inline
 *
 * @example
 * ```tsx
 * const indicatorStyles = generateIndicatorStyles(isHovering && isOverItems)
 *
 * <div style={indicatorStyles} />
 * ```
 */
export declare function generateIndicatorStyles(isVisible: boolean): React.CSSProperties;
export {};
//# sourceMappingURL=Sidebar.styles.d.ts.map