import React from 'react';
import type { LayoutBaseProps } from './LayoutBase.types';
/**
 * LayoutBase - Layout base del sistema Siesa
 *
 * Layout reutilizable que implementa la estructura base con NavigationRail
 * lateral, Navbar superior y área de contenido dinámico. Diseñado para ser
 * usado como wrapper en diferentes vistas de la aplicación.
 *
 * **Composición:**
 * - Navbar: Barra superior con logo Siesa, título del producto y dropdown de usuario
 * - NavigationRailGroup: Rail de navegación lateral con iconos y búsqueda
 * - Área de contenido: Contenido dinámico pasado como children
 *
 * **Mejores prácticas implementadas:**
 * - Orden de modificadores: {responsive}:{dark}:{state}:{utility}
 * - Dark mode con estrategia 'class' (darkMode: 'class')
 * - Tokens de color consistentes con la documentación
 * - Responsive design mobile-first con breakpoints md:, lg:, xl:
 * - Composición con componentes del sistema (NO reimplementación)
 * - Type safety con TypeScript estricto
 *
 * @see docs/colors.md - Sistema de colores
 * @see docs/typography.md - Sistema tipográfico
 * @see docs/spacing.md - Sistema de espaciado
 * @see src/components/Navbar - Componente Navbar reutilizado
 * @see src/components/NavigationRailGroup - Componente NavigationRail reutilizado
 *
 * @example
 * ```tsx
 * // Uso básico
 * <LayoutBase
 *   productName="Mi Aplicación"
 *   siesaLogoPath="/images/logos/Siesa_Logosimbolo_Blanco.svg"
 *   siesaLogoWidth="100px"
 *   siesaLogoHeight="40px"
 *   userDropdown={{
 *     avatar: '/avatar.jpg',
 *     name: 'Carlos',
 *     email: 'carlos@siesa.com',
 *   }}
 *   navigationItems={navigationItems}
 * >
 *   <div>Mi contenido personalizado</div>
 * </LayoutBase>
 *
 * // Uso avanzado con props pass-through
 * <LayoutBase
 *   productName="Sistema Avanzado"
 *   navbarProps={{
 *     showNavigationButton: true,
 *     environmentBadge: "Desarrollo",
 *     navigationButtonProps: { type: 'outline', size: 'l' },
 *     notifications: { cart: 5, bell: true },
 *     onCartClick: () => openCart(),
 *     onNotificationsClick: () => openNotifications(),
 *   }}
 *   navigationRailProps={{
 *     showSearchButton: true,
 *     labels: {
 *       searchPlaceholder: "Buscar módulos...",
 *       collapseButton: "Minimizar"
 *     },
 *     onItemClick: (item) => handleNavigation(item),
 *     onItemHover: (item) => showPreview(item),
 *   }}
 * >
 *   <div>Contenido con funcionalidad completa</div>
 * </LayoutBase>
 * ```
 */
export declare const LayoutBase: React.FC<LayoutBaseProps>;
//# sourceMappingURL=LayoutBase.d.ts.map