Make modal type builder optional by providing default breakpoint and modal type builder

lib/src/wolt_modal_sheet.dart

@@ -42,7 +42,7 @@ class WoltModalSheet<T> extends StatefulWidget {
   final VoidCallback? onModalDismissedWithBarrierTap;
   final VoidCallback? onModalDismissedWithDrag;
   final Widget Function(Widget)? decorator;
-  final WoltModalType Function(BuildContext context) modalTypeBuilder;
+  final WoltModalTypeBuilder modalTypeBuilder;
   final AnimationController? animationController;
   final WoltModalSheetRoute<T> route;
   final bool enableDragForBottomSheet;
@@ -60,7 +60,7 @@ class WoltModalSheet<T> extends StatefulWidget {
   static Future<T?> show<T>({
     required BuildContext context,
     required WoltModalSheetPageListBuilder pageListBuilder,
-    required WoltModalTypeBuilder modalTypeBuilder,
+    WoltModalTypeBuilder? modalTypeBuilder,
     ValueNotifier<int>? pageIndexNotifier,
     Widget Function(Widget)? decorator,
     bool useRootNavigator = false,
@@ -105,7 +105,7 @@ class WoltModalSheet<T> extends StatefulWidget {
   static Future<T?> showWithDynamicPath<T>({
     required BuildContext context,
     required ValueNotifier<WoltModalSheetPageListBuilder> pageListBuilderNotifier,
-    required WoltModalTypeBuilder modalTypeBuilder,
+    WoltModalTypeBuilder? modalTypeBuilder,
     ValueNotifier<int>? pageIndexNotifier,
     Widget Function(Widget)? decorator,
     bool useRootNavigator = false,
@@ -152,7 +152,7 @@ class WoltModalSheet<T> extends StatefulWidget {
 }
 
 class _WoltModalSheetState extends State<WoltModalSheet> {
-  late WoltModalType modalType;
+  late WoltModalType _modalType;
 
   ParametricCurve<double> animationCurve = decelerateEasing;
 
@@ -191,7 +191,7 @@ class _WoltModalSheetState extends State<WoltModalSheet> {
   @override
   void didChangeDependencies() {
     super.didChangeDependencies();
-    modalType = widget.modalTypeBuilder(context);
+    _modalType = widget.modalTypeBuilder(context);
   }
 
   @override
@@ -209,12 +209,12 @@ class _WoltModalSheetState extends State<WoltModalSheet> {
             builder: (_, int pageIndex, __) {
               final page = pages[pageIndex];
               final enableDrag =
-                  modalType == WoltModalType.bottomSheet && widget.enableDragForBottomSheet;
+                  _modalType == WoltModalType.bottomSheet && widget.enableDragForBottomSheet;
               final multiChildLayout = CustomMultiChildLayout(
                 delegate: WoltModalMultiChildLayoutDelegate(
                   contentLayoutId: contentLayoutId,
                   barrierLayoutId: barrierLayoutId,
-                  modalType: modalType,
+                  modalType: _modalType,
                   minPageHeight: widget.minPageHeight ?? 0,
                   maxPageHeight: widget.maxPageHeight ?? 0.9,
                   minDialogWidth: widget.minDialogWidth ?? 0,
@@ -240,7 +240,7 @@ class _WoltModalSheetState extends State<WoltModalSheet> {
                         child: Material(
                           color: page.backgroundColor,
                           shape: RoundedRectangleBorder(
-                            borderRadius: modalType.borderRadiusGeometry(
+                            borderRadius: _modalType.borderRadiusGeometry(
                               /// TODO: Make this configurable through theme extension
                               _containerRadiusAmount,
                             ),
@@ -249,7 +249,7 @@ class _WoltModalSheetState extends State<WoltModalSheet> {
                           child: LayoutBuilder(
                             builder: (_, constraints) {
                               return WoltModalSheetAnimatedSwitcher(
-                                woltModalType: modalType,
+                                woltModalType: _modalType,
                                 pageIndex: pageIndex,
                                 pages: pages,
                                 sheetWidth: constraints.maxWidth,
@@ -268,7 +268,7 @@ class _WoltModalSheetState extends State<WoltModalSheet> {
                     ? Stack(
                         children: [
                           SafeArea(child: multiChildLayout),
-                          if (modalType == WoltModalType.bottomSheet)
+                          if (_modalType == WoltModalType.bottomSheet)
                             Positioned(
                               bottom: 0,
                               left: 0,

lib/src/wolt_modal_sheet_route.dart

@@ -1,14 +1,22 @@
 import 'package:flutter/material.dart';
 import 'package:wolt_modal_sheet/wolt_modal_sheet.dart';
 
+double _defaultModalTypeBreakPoint = 768.0;
+
+WoltModalTypeBuilder _defaultModalTypeBuilder = (context) {
+  return MediaQuery.of(context).size.width < _defaultModalTypeBreakPoint
+      ? WoltModalType.bottomSheet
+      : WoltModalType.dialog;
+};
+
 class WoltModalSheetRoute<T> extends PageRoute<T> {
   WoltModalSheetRoute({
     required this.pageListBuilderNotifier,
-    required this.modalTypeBuilder,
     this.pageIndexNotifier,
     this.decorator,
     this.onModalDismissedWithBarrierTap,
     this.onModalDismissedWithDrag,
+    WoltModalTypeBuilder? modalTypeBuilder,
     bool? enableDragForBottomSheet,
     bool? useSafeArea,
     bool? barrierDismissible,
@@ -26,6 +34,7 @@ class WoltModalSheetRoute<T> extends PageRoute<T> {
         _transitionAnimationController = transitionAnimationController,
         _transitionDuration = transitionDuration ?? const Duration(milliseconds: 300),
         _barrierDismissible = barrierDismissible ?? true,
+        _modalTypeBuilder = modalTypeBuilder ?? _defaultModalTypeBuilder,
         _bottomSheetTransitionAnimation = bottomSheetTransitionAnimation,
         _dialogTransitionAnimation = dialogTransitionAnimation,
         _minDialogWidth = minDialogWidth,
@@ -40,7 +49,7 @@ class WoltModalSheetRoute<T> extends PageRoute<T> {
 
   final ValueNotifier<int>? pageIndexNotifier;
 
-  final WoltModalTypeBuilder modalTypeBuilder;
+  final WoltModalTypeBuilder _modalTypeBuilder;
 
   late final Duration _transitionDuration;
 
@@ -101,7 +110,7 @@ class WoltModalSheetRoute<T> extends PageRoute<T> {
       decorator: decorator,
       pageIndexNotifier: pageIndexNotifier ?? ValueNotifier(0),
       pageListBuilderNotifier: pageListBuilderNotifier,
-      modalTypeBuilder: modalTypeBuilder,
+      modalTypeBuilder: _modalTypeBuilder,
       onModalDismissedWithBarrierTap: onModalDismissedWithBarrierTap,
       onModalDismissedWithDrag: onModalDismissedWithDrag,
       animationController: animationController,
@@ -121,7 +130,7 @@ class WoltModalSheetRoute<T> extends PageRoute<T> {
     Animation<double> secondaryAnimation,
     Widget child,
   ) {
-    final modalType = modalTypeBuilder(context);
+    final modalType = _modalTypeBuilder(context);
     const easeCurve = Curves.ease;
     switch (modalType) {
       case WoltModalType.bottomSheet:

playground_navigator2/lib/main.dart

@@ -10,7 +10,6 @@ import 'package:playground_navigator2/modal/pages/multi_page_path_name.dart';
 import 'package:playground_navigator2/router/playground_route_information_parser.dart';
 import 'package:playground_navigator2/router/playground_router_delegate.dart';
 import 'package:wolt_modal_sheet/wolt_modal_sheet.dart';
-import 'package:wolt_responsive_layout_grid/wolt_responsive_layout_grid.dart';
 
 void main() => runApp(const DemoApp());
 
@@ -27,15 +26,6 @@ class _DemoAppState extends State<DemoApp> {
   final ValueNotifier<WoltModalSheetPageListBuilder> pageListBuilderNotifier =
       ValueNotifier(MultiPagePathName.defaultPath.pageListBuilder);
 
-  WoltModalType modalTypeBuilder(BuildContext context) {
-    switch (context.screenSize) {
-      case WoltScreenSize.small:
-        return WoltModalType.bottomSheet;
-      case WoltScreenSize.large:
-        return WoltModalType.dialog;
-    }
-  }
-
   @override
   void initState() {
     super.initState();

playground_navigator2/lib/router/playground_router_delegate.dart

@@ -31,15 +31,6 @@ class PlaygroundRouterDelegate extends RouterDelegate<PlaygroundRouterConfigurat
   final ValueNotifier<int> _pageIndexNotifier;
   final ValueNotifier<WoltModalSheetPageListBuilder> _pageListBuilderNotifier;
 
-  WoltModalType modalTypeBuilder(BuildContext context) {
-    switch (context.screenSize) {
-      case WoltScreenSize.small:
-        return WoltModalType.bottomSheet;
-      case WoltScreenSize.large:
-        return WoltModalType.dialog;
-    }
-  }
-
   @override
   GlobalKey<NavigatorState>? get navigatorKey => _navigatorKey;
 
@@ -55,7 +46,6 @@ class PlaygroundRouterDelegate extends RouterDelegate<PlaygroundRouterConfigurat
         SheetPage(
           pageIndexNotifier: _pageIndexNotifier,
           pageListBuilderNotifier: _pageListBuilderNotifier,
-          modalTypeBuilder: modalTypeBuilder,
         ),
       ];
     } else if (state is UnknownScreenVisibleState) {

playground_navigator2/lib/router/router_pages/sheet_page.dart

@@ -8,20 +8,17 @@ class SheetPage extends Page<void> {
   const SheetPage({
     required this.pageIndexNotifier,
     required this.pageListBuilderNotifier,
-    required this.modalTypeBuilder,
   }) : super(key: const ValueKey('SheetPage'));
 
   final ValueNotifier<int> pageIndexNotifier;
   final ValueNotifier<WoltModalSheetPageListBuilder> pageListBuilderNotifier;
-  final WoltModalType Function(BuildContext context) modalTypeBuilder;
 
   static const String routeName = 'Modal Sheet';
 
   @override
   Route<void> createRoute(BuildContext context) {
     return WoltModalSheetRoute<void>(
       pageIndexNotifier: pageIndexNotifier,
-      modalTypeBuilder: modalTypeBuilder,
       pageListBuilderNotifier: pageListBuilderNotifier,
       onModalDismissedWithDrag: () {
         context.read<RouterCubit>().closeSheet();

playground_navigator2/pubspec.yaml

@@ -9,7 +9,6 @@ dependencies:
     sdk: flutter
   equatable: ^2.0.5
   flutter_bloc: ^8.1.3
-  wolt_responsive_layout_grid: ^0.0.3
   wolt_modal_sheet:
     path: ..
   demo_ui_components: