import 'package:flutter/material.dart'; import 'package:tm_app/core/utils/breakpoints.dart'; /// A responsive builder widget that automatically switches between different /// layouts based on the current display size. /// /// This widget can be used by all screens to handle responsive layouts. class ResponsiveBuilder extends StatelessWidget { /// The widget to display on extra small screens (mobile) final Widget? mobile; /// The widget to display on small screens (tablet) final Widget? tablet; /// The widget to display on large screens (desktop) final Widget? desktop; /// A builder function that receives the current display size /// Use this when you want to handle the layout logic yourself final Widget Function(BuildContext context, DisplaySize? displaySize)? builder; const ResponsiveBuilder({ super.key, this.mobile, this.tablet, this.desktop, this.builder, }) : assert( builder != null || mobile != null, 'Either builder or at least mobile layout must be provided', ); @override Widget build(BuildContext context) { final size = MediaQuery.sizeOf(context); final displaySize = size.displaySize; // If builder is provided, use it if (builder != null) { return builder!(context, displaySize); } // Otherwise, use the appropriate widget based on display size return switch (displaySize) { DisplaySize.extraSmall => mobile ?? _defaultWidget(), DisplaySize.small => tablet ?? mobile ?? _defaultWidget(), DisplaySize.medium => desktop ?? mobile ?? _defaultWidget(), DisplaySize.large => desktop ?? mobile ?? _defaultWidget(), }; } Widget _defaultWidget() { return const SizedBox.shrink(); } }