meshcore-open/lib/widgets/quick_switch_bar.dart

import 'dart:ui';

import 'package:flutter/material.dart';

class QuickSwitchBar extends StatelessWidget {
  final int selectedIndex;
  final ValueChanged<int> onDestinationSelected;

  const QuickSwitchBar({
    super.key,
    required this.selectedIndex,
    required this.onDestinationSelected,
  });

  @override
  Widget build(BuildContext context) {
    final theme = Theme.of(context);
    final colorScheme = theme.colorScheme;
    final labelStyle = theme.textTheme.labelMedium ?? const TextStyle();

    return SizedBox(
      width: double.infinity,
      child: ClipRRect(
        borderRadius: BorderRadius.circular(20),
        child: BackdropFilter(
          filter: ImageFilter.blur(sigmaX: 14, sigmaY: 14),
          child: DecoratedBox(
            decoration: BoxDecoration(
              color: Colors.transparent,
              border: Border.all(
                color: colorScheme.outlineVariant.withValues(alpha: 0.4),
              ),
            ),
            child: NavigationBarTheme(
              data: NavigationBarThemeData(
                backgroundColor: Colors.transparent,
                surfaceTintColor: Colors.transparent,
                shadowColor: Colors.transparent,
                indicatorColor: colorScheme.primaryContainer,
                labelTextStyle: MaterialStateProperty.resolveWith((states) {
                  final isSelected = states.contains(MaterialState.selected);
                  return labelStyle.copyWith(
                    fontWeight: isSelected ? FontWeight.w700 : FontWeight.w500,
                    color: isSelected
                        ? colorScheme.onPrimaryContainer
                        : colorScheme.onSurfaceVariant,
                  );
                }),
                iconTheme: MaterialStateProperty.resolveWith((states) {
                  final isSelected = states.contains(MaterialState.selected);
                  return IconThemeData(
                    color: isSelected
                        ? colorScheme.onPrimaryContainer
                        : colorScheme.onSurfaceVariant,
                  );
                }),
              ),
              child: NavigationBar(
                height: 60,
                selectedIndex: selectedIndex,
                onDestinationSelected: onDestinationSelected,
                destinations: const [
                  NavigationDestination(
                    icon: Icon(Icons.people_outline),
                    label: 'Contacts',
                  ),
                  NavigationDestination(
                    icon: Icon(Icons.tag),
                    label: 'Channels',
                  ),
                  NavigationDestination(
                    icon: Icon(Icons.map_outlined),
                    label: 'Map',
                  ),
                ],
              ),
            ),
          ),
        ),
      ),
    );
  }
}