packages/wyatt_ui_layout/example/lib/pages/app_bar_layout_page.dart

@@ -7,7 +7,7 @@ class AppBarLayoutPage extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) => TopAppBarLayout(
-        custom: (p0) => p0?.copyWith.call(title: 'New Title'.wrap()),
+        custom: (p0) => p0?.copyWith.title('New Title'.wrap()),
         body: const Center(
           child: Text(
             'Body',

packages/wyatt_ui_layout/lib/src/presentation/layouts/app_bar_layout.dart

@@ -1,68 +0,0 @@
-// Copyright (C) 2022 WYATT GROUP
-// Please see the AUTHORS file for details.
-//
-// This program is free software: you can redistribute it and/or modify
-// it under the terms of the GNU General Public License as published by
-// the Free Software Foundation, either version 3 of the License, or
-// any later version.
-//
-// This program is distributed in the hope that it will be useful,
-// but WITHOUT ANY WARRANTY; without even the implied warranty of
-// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
-// GNU General Public License for more details.
-//
-// You should have received a copy of the GNU General Public License
-// along with this program. If not, see <https://www.gnu.org/licenses/>.
-
-import 'package:flutter/material.dart';
-import 'package:wyatt_ui_components/wyatt_wyatt_ui_components.dart';
-import 'package:wyatt_ui_layout/src/presentation/layouts/layout.dart';
-
-abstract class TopBarLayout<T extends TopBarComponent> extends Layout {
-  const TopBarLayout({
-    required this.body,
-    this.custom,
-    this.height = 60,
-    super.key,
-  });
-  final Widget body;
-
-  final T? Function(T?)? custom;
-  final double height;
-
-  T? child(BuildContext context);
-
-  @override
-  Widget build(BuildContext context) => Scaffold(
-        appBar: PreferredSize(
-          preferredSize: Size.fromHeight(height),
-          child: custom?.call(child(context)) ?? const SizedBox.shrink(),
-        ),
-        body: body,
-      );
-}
-
-class TopAppBarLayout extends TopBarLayout<TopAppBarComponent> {
-  const TopAppBarLayout({
-    required super.body,
-    super.custom,
-    super.height,
-    super.key,
-  });
-
-  @override
-  TopAppBarComponent? child(BuildContext context) => context.components.appBar;
-}
-
-class TopNavigationBarLayout extends TopBarLayout<TopNavigationBarComponent> {
-  const TopNavigationBarLayout({
-    required super.body,
-    super.custom,
-    super.height,
-    super.key,
-  });
-
-  @override
-  TopNavigationBarComponent? child(BuildContext context) =>
-      context.components.topNavigationBarComponent;
-}

packages/wyatt_ui_layout/lib/src/presentation/layouts/bottom_navigation_bar_layout.dart

@@ -1,21 +1,56 @@
+// Copyright (C) 2022 WYATT GROUP
+// Please see the AUTHORS file for details.
+//
+// This program is free software: you can redistribute it and/or modify
+// it under the terms of the GNU General Public License as published by
+// the Free Software Foundation, either version 3 of the License, or
+// any later version.
+//
+// This program is distributed in the hope that it will be useful,
+// but WITHOUT ANY WARRANTY; without even the implied warranty of
+// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+// GNU General Public License for more details.
+//
+// You should have received a copy of the GNU General Public License
+// along with this program. If not, see <https://www.gnu.org/licenses/>.
+
+/// This file contains the concrete class [BottomNavigationBarLayout].
+///
+/// The [BottomNavigationBarLayout] class is a concrete implementation of the
+/// [Layout] abstract class, which defines a layout structure with a bottom
+/// navigation bar component.
+///
+/// [BottomNavigationBarLayout] includes an optional
+/// [BottomNavigationBarLayout.custom]
+/// function for customizing the bottom navigation bar component.
 import 'package:flutter/material.dart';
 import 'package:wyatt_ui_components/wyatt_wyatt_ui_components.dart';
 import 'package:wyatt_ui_layout/src/presentation/layouts/layout.dart';
 
+/// A concrete implementation of the [Layout] abstract class for a layout with
+/// a bottom navigation bar component.
 class BottomNavigationBarLayout extends Layout {
+  /// Creates a [BottomNavigationBarLayout] instance.
+  ///
+  /// [body] represents the main content of the layout.
+  /// [custom] is an optional function that can be used to customize
+  /// the bottom navigation bar component.
   const BottomNavigationBarLayout({
     required this.body,
     this.custom,
     super.key,
   });
+
   final Widget? body;
   final BottomNavigationBarComponent? Function(BottomNavigationBarComponent?)?
       custom;
+
   @override
   Widget build(BuildContext context) => Scaffold(
         body: body,
         bottomNavigationBar: custom?.call(
-          context.components.bottomNavigationBar,
+              context.components.bottomNavigationBar,
-        ),
+            ) ??
+            context.components.bottomNavigationBar,
       );
 }

packages/wyatt_ui_layout/lib/src/presentation/layouts/frame_layout.dart

@@ -13,12 +13,26 @@
 //
 // You should have received a copy of the GNU General Public License
 // along with this program. If not, see <https://www.gnu.org/licenses/>.
-
 import 'package:flutter/material.dart';
 import 'package:wyatt_ui_components/wyatt_wyatt_ui_components.dart';
 import 'package:wyatt_ui_layout/src/presentation/layouts/layout.dart';
 
+/// A layout that contains a top app bar, a body and a bottom navigation bar.
+///
+/// This layout consists of a [TopAppBarComponent] at the top of the screen,
+/// a [body] in the middle and a [BottomNavigationBarComponent] at the bottom.
+/// You can customize the app bar and the bottom navigation bar by passing
+/// a [customAppBar] and a [customBottomNavBar] functions that take
+/// the corresponding components and return the customized ones.
 class FrameLayout extends Layout {
+  /// Creates a [FrameLayout] instance.
+  ///
+  /// [body] represents the main content of the layout.
+  /// [customAppBar] is an optional function that can be used to customize
+  ///  the top app bar component.
+  /// [customBottomNavBar] is an optional function that can be used to customize
+  ///  the bottom navigation bar component.
+  /// [height] represents the height of the top app bar.
   const FrameLayout({
     required this.body,
     this.customAppBar,
@@ -35,13 +49,17 @@ class FrameLayout extends Layout {
 
   @override
   Widget build(BuildContext context) => Scaffold(
-        appBar: PreferredSize(
+        appBar: (customAppBar?.call(context.components.appBar) != null ||
-          preferredSize: Size.fromHeight(height),
+                context.components.appBar != null)
-          child: customAppBar?.call(context.components.appBar) ??
+            ? PreferredSize(
-              const SizedBox.shrink(),
+                preferredSize: Size.fromHeight(height),
-        ),
+                child: customAppBar?.call(context.components.appBar) ??
+                    context.components.appBar!,
+              )
+            : null,
         body: body,
         bottomNavigationBar:
-            customBottomNavBar?.call(context.components.bottomNavigationBar),
+            customBottomNavBar?.call(context.components.bottomNavigationBar) ??
+                context.components.bottomNavigationBar,
       );
 }

packages/wyatt_ui_layout/lib/src/presentation/layouts/layout.dart

@@ -1,5 +1,33 @@
+// Copyright (C) 2022 WYATT GROUP
+// Please see the AUTHORS file for details.
+//
+// This program is free software: you can redistribute it and/or modify
+// it under the terms of the GNU General Public License as published by
+// the Free Software Foundation, either version 3 of the License, or
+// any later version.
+//
+// This program is distributed in the hope that it will be useful,
+// but WITHOUT ANY WARRANTY; without even the implied warranty of
+// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+// GNU General Public License for more details.
+//
+// You should have received a copy of the GNU General Public License
+// along with this program. If not, see <https://www.gnu.org/licenses/>.
+
+/// This file contains the [Layout] abstract class, which provides a base
+/// for creating custom layout widgets in Flutter.
 import 'package:flutter/material.dart';
 
+/// An abstract class that provides a base for creating custom layout widgets.
+///
+/// This class can be used as a base for creating custom layout widgets in
+/// Flutter. It extends the [StatelessWidget] class and adds support for
+/// providing a custom key. Custom layout widgets that extend this class should
+/// override the [build] method to define the layout.
 abstract class Layout extends StatelessWidget {
+  /// Creates a new [Layout] instance.
+  ///
+  /// [key] is an optional parameter that can be used to provide a custom key
+  /// for the widget.
   const Layout({super.key});
 }

packages/wyatt_ui_layout/lib/src/presentation/layouts/top_app_bar_layout.dart

@@ -0,0 +1,108 @@
+// Copyright (C) 2022 WYATT GROUP
+// Please see the AUTHORS file for details.
+//
+// This program is free software: you can redistribute it and/or modify
+// it under the terms of the GNU General Public License as published by
+// the Free Software Foundation, either version 3 of the License, or
+// any later version.
+//
+// This program is distributed in the hope that it will be useful,
+// but WITHOUT ANY WARRANTY; without even the implied warranty of
+// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+// GNU General Public License for more details.
+//
+// You should have received a copy of the GNU General Public License
+// along with this program. If not, see <https://www.gnu.org/licenses/>.
+
+/// This file contains the abstract class [TopBarLayout] and two concrete
+/// classes [TopAppBarLayout] and [TopNavigationBarLayout].
+/// The [TopBarLayout] abstract class defines a layout structure with a top bar.
+/// The [TopAppBarLayout] and [TopNavigationBarLayout] classes are concrete
+///  implementations of the [TopBarLayout] class.
+
+import 'package:flutter/material.dart';
+import 'package:wyatt_ui_components/wyatt_wyatt_ui_components.dart';
+import 'package:wyatt_ui_layout/src/presentation/layouts/layout.dart';
+
+/// An abstract class for creating layouts with a top bar component.
+///
+/// This class provides a base for creating layouts that include a top bar
+/// component, such as an app bar or navigation bar.
+///
+/// Implementations of this class must provide a concrete implementation of
+/// the [child] method, which returns the specific top bar component for the
+/// given [BuildContext].
+///
+/// [T] represents the type of the top bar component.
+abstract class TopBarLayout<T extends TopBarComponent> extends Layout {
+  /// Creates a [TopBarLayout] instance.
+  ///
+  /// [body] represents the main content of the layout.
+  /// [custom] is an optional function that can be used to customize
+  ///  the top bar component.
+  /// [height] represents the height of the top bar.
+  const TopBarLayout({
+    required this.body,
+    this.custom,
+    this.height = 60,
+    super.key,
+  });
+
+  final Widget body;
+
+  final T? Function(T?)? custom;
+  final double height;
+
+  /// Returns the top bar component for the given [BuildContext].
+  T? child(BuildContext context);
+
+  @override
+  Widget build(BuildContext context) => Scaffold(
+        appBar: (custom?.call(child(context)) != null || child(context) != null)
+            ? PreferredSize(
+                preferredSize: Size.fromHeight(height),
+                child: custom?.call(child(context)) ?? child(context)!,
+              )
+            : null,
+        body: body,
+      );
+}
+
+/// A concrete implementation of [TopBarLayout] for an app bar.
+class TopAppBarLayout extends TopBarLayout<TopAppBarComponent> {
+  /// Creates a [TopAppBarLayout] instance.
+  ///
+  /// [body] represents the main content of the layout.
+  /// [custom] is an optional function that can be used to customize
+  ///  the top bar component.
+  /// [height] represents the height of the top bar.
+  const TopAppBarLayout({
+    required super.body,
+    super.custom,
+    super.height,
+    super.key,
+  });
+
+  @override
+  TopAppBarComponent? child(BuildContext context) => context.components.appBar;
+}
+
+/// A concrete implementation of [TopBarLayout] for a navigation bar.
+class TopNavigationBarLayout extends TopBarLayout<TopNavigationBarComponent> {
+  /// Creates a [TopNavigationBarLayout] instance.
+  ///
+  /// [body] represents the main content of the layout.
+  /// [custom] is an optional function that can be used to customize
+  ///  the top bar component.
+  /// [height] represents the height of the top bar.
+  const TopNavigationBarLayout({
+    required super.body,
+    super.custom,
+    super.height,
+    super.key,
+  });
+
+  @override
+  TopNavigationBarComponent? child(BuildContext context) =>
+      context.components.topNavigationBarComponent;
+}

packages/wyatt_ui_layout/lib/src/presentation/presentation.dart

@@ -1,3 +1,19 @@
-export 'layouts/app_bar_layout.dart';
+// Copyright (C) 2022 WYATT GROUP
+// Please see the AUTHORS file for details.
+//
+// This program is free software: you can redistribute it and/or modify
+// it under the terms of the GNU General Public License as published by
+// the Free Software Foundation, either version 3 of the License, or
+// any later version.
+//
+// This program is distributed in the hope that it will be useful,
+// but WITHOUT ANY WARRANTY; without even the implied warranty of
+// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+// GNU General Public License for more details.
+//
+// You should have received a copy of the GNU General Public License
+// along with this program. If not, see <https://www.gnu.org/licenses/>.
+
 export 'layouts/bottom_navigation_bar_layout.dart';
 export 'layouts/frame_layout.dart';
+export 'layouts/top_app_bar_layout.dart';