import 'package:flutter/material.dart'; import 'package:lucide_icons/lucide_icons.dart'; import '../../core/theme/design_tokens.dart'; enum DockTab { todo, calendar } class BottomDock extends StatelessWidget { final DockTab activeTab; final VoidCallback? onTodoTap; final VoidCallback? onCalendarTap; final VoidCallback? onHomeTap; const BottomDock({ super.key, required this.activeTab, this.onTodoTap, this.onCalendarTap, this.onHomeTap, }); @override Widget build(BuildContext context) { final colorScheme = Theme.of(context).colorScheme; return Container( height: 72, padding: const EdgeInsets.only( left: AppSpacing.xl, right: AppSpacing.xl, top: AppSpacing.md, bottom: AppSpacing.sm, ), child: Row( mainAxisAlignment: MainAxisAlignment.spaceBetween, crossAxisAlignment: CrossAxisAlignment.center, children: [ _buildToggle(context, colorScheme), _buildHomeBtn(context, colorScheme), ], ), ); } Widget _buildToggle(BuildContext context, ColorScheme colorScheme) { return Container( padding: const EdgeInsets.symmetric(horizontal: 5, vertical: 4), decoration: BoxDecoration( color: colorScheme.surfaceContainerLow, borderRadius: BorderRadius.circular(AppRadius.xxl), border: Border.all(color: colorScheme.outlineVariant), boxShadow: [ BoxShadow( color: colorScheme.shadow.withValues(alpha: 0.12), blurRadius: AppRadius.sm, offset: const Offset(0, AppSpacing.xs / 2), ), ], ), child: Row( mainAxisSize: MainAxisSize.min, crossAxisAlignment: CrossAxisAlignment.center, children: [ _buildToggleItem( icon: LucideIcons.listTodo, isActive: activeTab == DockTab.todo, onTap: onTodoTap, colorScheme: colorScheme, ), const SizedBox(width: 4), _buildToggleItem( icon: LucideIcons.calendar, isActive: activeTab == DockTab.calendar, onTap: onCalendarTap, colorScheme: colorScheme, ), ], ), ); } Widget _buildToggleItem({ required IconData icon, required bool isActive, required ColorScheme colorScheme, VoidCallback? onTap, }) { return Material( color: colorScheme.surface.withValues(alpha: 0), child: InkWell( onTap: onTap, borderRadius: BorderRadius.circular(AppRadius.xl), child: AnimatedContainer( duration: const Duration(milliseconds: 140), curve: Curves.easeOut, width: 44, height: 44, decoration: BoxDecoration( color: isActive ? colorScheme.secondaryContainer : colorScheme.surface.withValues(alpha: 0), borderRadius: BorderRadius.circular(AppRadius.xl), border: Border.all( color: isActive ? colorScheme.primary.withValues(alpha: 0.35) : colorScheme.surface.withValues(alpha: 0), ), ), child: Icon( icon, size: 20, color: isActive ? colorScheme.primary : colorScheme.onSurfaceVariant, ), ), ), ); } Widget _buildHomeBtn(BuildContext context, ColorScheme colorScheme) { return Material( color: colorScheme.surface.withValues(alpha: 0), child: InkWell( key: const ValueKey('bottom_dock_home_button'), onTap: onHomeTap, borderRadius: BorderRadius.circular(AppRadius.xl), child: Container( width: 44, height: 44, decoration: BoxDecoration( color: colorScheme.surfaceContainerLow, borderRadius: BorderRadius.circular(AppRadius.xl), border: Border.all(color: colorScheme.outlineVariant), boxShadow: [ BoxShadow( color: colorScheme.shadow.withValues(alpha: 0.12), blurRadius: AppRadius.sm, offset: const Offset(0, AppSpacing.xs / 2), ), ], ), child: Icon( LucideIcons.home, size: 20, color: colorScheme.onSurfaceVariant, ), ), ), ); } }