diff --git a/packages/wyatt_ui_components/lib/src/features/component_theme_data.dart b/packages/wyatt_ui_components/lib/src/features/component_theme_data.dart
index fedbd98d..6ba64e33 100644
--- a/packages/wyatt_ui_components/lib/src/features/component_theme_data.dart
+++ b/packages/wyatt_ui_components/lib/src/features/component_theme_data.dart
@@ -18,6 +18,7 @@ import 'package:copy_with_extension/copy_with_extension.dart';
 import 'package:flutter/material.dart';
 import 'package:wyatt_ui_components/src/core/utils/component_registry.dart';
 import 'package:wyatt_ui_components/src/domain/entities/entities.dart';
+
 part 'component_theme_data.g.dart';
 
 /// {@template component_theme_data}
@@ -128,17 +129,35 @@ class ComponentThemeData {
     return returned;
   }
 
+  R? _getOrNull<T extends Component, R>(T? component, R? returned) {
+    if (component == null) {
+      return null;
+    }
+
+    return returned;
+  }
+
   // Bars
   final ComponentRegistry<TopAppBarComponent>? topAppBars;
   $TopAppBarComponentCWProxy topAppBarComponent([String? id]) =>
       _get(topAppBars?.call(id), topAppBars?.call(id)?.copyWith);
 
+  $TopAppBarComponentCWProxy? topAppBarComponentOrNull([String? id]) =>
+      _getOrNull(topAppBars?.call(id), topAppBars?.call(id)?.copyWith);
+
   final ComponentRegistry<TopNavigationBarComponent>? topNavigationBars;
   $TopNavigationBarComponentCWProxy topNavigationBarComponent([String? id]) =>
       _get(
         topNavigationBars?.call(id),
         topNavigationBars?.call(id)?.copyWith,
       );
+  $TopNavigationBarComponentCWProxy? topNavigationBarComponentOrNull([
+    String? id,
+  ]) =>
+      _getOrNull(
+        topNavigationBars?.call(id),
+        topNavigationBars?.call(id)?.copyWith,
+      );
 
   final ComponentRegistry<BottomNavigationBarComponent>? bottomNavigationBars;
   $BottomNavigationBarComponentCWProxy bottomNavigationBarComponent([
@@ -148,46 +167,84 @@ class ComponentThemeData {
         bottomNavigationBars?.call(id),
         bottomNavigationBars?.call(id)?.copyWith,
       );
+  $BottomNavigationBarComponentCWProxy? bottomNavigationBarComponentOrNull([
+    String? id,
+  ]) =>
+      _getOrNull(
+        bottomNavigationBars?.call(id),
+        bottomNavigationBars?.call(id)?.copyWith,
+      );
 
   // CRUD Widgets
   final ComponentRegistry<ErrorComponent>? errors;
   $ErrorComponentCWProxy errorComponent([String? id]) =>
       _get(errors?.call(id), errors?.call(id)?.copyWith);
+  $ErrorComponentCWProxy? errorComponentOrNull([String? id]) =>
+      _getOrNull(errors?.call(id), errors?.call(id)?.copyWith);
 
   final ComponentRegistry<LoaderComponent>? loaders;
   $LoaderComponentCWProxy loaderComponent([String? id]) =>
       _get(loaders?.call(id), loaders?.call(id)?.copyWith);
+  $LoaderComponentCWProxy? loaderComponentOrNull([String? id]) =>
+      _getOrNull(loaders?.call(id), loaders?.call(id)?.copyWith);
 
   // Cards
   final ComponentRegistry<InformationCardComponent>? informationCards;
   $InformationCardComponentCWProxy informationCardComponent([String? id]) =>
       _get(informationCards?.call(id), informationCards?.call(id)?.copyWith);
+  $InformationCardComponentCWProxy? informationCardComponentOrNull([
+    String? id,
+  ]) =>
+      _getOrNull(
+        informationCards?.call(id),
+        informationCards?.call(id)?.copyWith,
+      );
 
   final ComponentRegistry<PortfolioCardComponent>? portfolioCards;
   $PortfolioCardComponentCWProxy portfolioCardComponent([String? id]) =>
       _get(portfolioCards?.call(id), portfolioCards?.call(id)?.copyWith);
+  $PortfolioCardComponentCWProxy? portfolioCardComponentOrNull([String? id]) =>
+      _getOrNull(
+        portfolioCards?.call(id),
+        portfolioCards?.call(id)?.copyWith,
+      );
 
   final ComponentRegistry<QuoteCardComponent>? quoteCards;
   $QuoteCardComponentCWProxy quoteCardComponent([String? id]) =>
       _get(quoteCards?.call(id), quoteCards?.call(id)?.copyWith);
+  $QuoteCardComponentCWProxy? quoteCardComponentOrNull([String? id]) =>
+      _getOrNull(quoteCards?.call(id), quoteCards?.call(id)?.copyWith);
 
   final ComponentRegistry<SkillCardComponent>? skillCards;
   $SkillCardComponentCWProxy skillCardComponent([String? id]) =>
       _get(skillCards?.call(id), skillCards?.call(id)?.copyWith);
+  $SkillCardComponentCWProxy? skillCardComponentOrNull([String? id]) =>
+      _getOrNull(skillCards?.call(id), skillCards?.call(id)?.copyWith);
 
   final ComponentRegistry<PricingCardComponent>? pricingCards;
   $PricingCardComponentCWProxy pricingCardComponent([String? id]) =>
       _get(pricingCards?.call(id), pricingCards?.call(id)?.copyWith);
+  $PricingCardComponentCWProxy? pricingCardComponentOrNull([String? id]) =>
+      _getOrNull(pricingCards?.call(id), pricingCards?.call(id)?.copyWith);
 
   // Rich Text
   final ComponentRegistry<RichTextBuilderComponent>? richTextBuilders;
   $RichTextBuilderComponentCWProxy richTextBuilderComponent([String? id]) =>
       _get(richTextBuilders?.call(id), richTextBuilders?.call(id)?.copyWith);
+  $RichTextBuilderComponentCWProxy? richTextBuilderComponentOrNull([
+    String? id,
+  ]) =>
+      _getOrNull(
+        richTextBuilders?.call(id),
+        richTextBuilders?.call(id)?.copyWith,
+      );
 
   // Text Inputs
   final ComponentRegistry<TextInputComponent>? textInputs;
   $TextInputComponentCWProxy textInputComponent([String? id]) =>
       _get(textInputs?.call(id), textInputs?.call(id)?.copyWith);
+  $TextInputComponentCWProxy? textInputComponentOrNull([String? id]) =>
+      _getOrNull(textInputs?.call(id), textInputs?.call(id)?.copyWith);
 
   // Buttons
   final ComponentRegistry<FileSelectionButtonComponent>? fileSelectionButtons;
@@ -198,10 +255,19 @@ class ComponentThemeData {
         fileSelectionButtons?.call(id),
         fileSelectionButtons?.call(id)?.copyWith,
       );
+  $FileSelectionButtonComponentCWProxy? fileSelectionButtonComponentOrNull([
+    String? id,
+  ]) =>
+      _getOrNull(
+        fileSelectionButtons?.call(id),
+        fileSelectionButtons?.call(id)?.copyWith,
+      );
 
   final ComponentRegistry<FlatButtonComponent>? flatButtons;
   $FlatButtonComponentCWProxy flatButtonComponent([String? id]) =>
       _get(flatButtons?.call(id), flatButtons?.call(id)?.copyWith);
+  $FlatButtonComponentCWProxy? flatButtonComponentOrNull([String? id]) =>
+      _getOrNull(flatButtons?.call(id), flatButtons?.call(id)?.copyWith);
 
   final ComponentRegistry<SimpleIconButtonComponent>? simpleIconButtons;
   $SimpleIconButtonComponentCWProxy simpleIconButtonComponent([String? id]) =>
@@ -209,10 +275,19 @@ class ComponentThemeData {
         simpleIconButtons?.call(id),
         simpleIconButtons?.call(id)?.copyWith,
       );
+  $SimpleIconButtonComponentCWProxy? simpleIconButtonComponentOrNull([
+    String? id,
+  ]) =>
+      _getOrNull(
+        simpleIconButtons?.call(id),
+        simpleIconButtons?.call(id)?.copyWith,
+      );
 
   final ComponentRegistry<SymbolButtonComponent>? symbolButtons;
   $SymbolButtonComponentCWProxy symbolButtonComponent([String? id]) =>
       _get(symbolButtons?.call(id), symbolButtons?.call(id)?.copyWith);
+  $SymbolButtonComponentCWProxy? symbolButtonComponentOrNull([String? id]) =>
+      _getOrNull(symbolButtons?.call(id), symbolButtons?.call(id)?.copyWith);
 
   final ComponentRegistry<FloatingActionButtonComponent>? floatingActionButtons;
   $FloatingActionButtonComponentCWProxy floatingActionButtonComponent([
@@ -222,4 +297,11 @@ class ComponentThemeData {
         floatingActionButtons?.call(id),
         floatingActionButtons?.call(id)?.copyWith,
       );
+  $FloatingActionButtonComponentCWProxy? floatingActionButtonComponentOrNull([
+    String? id,
+  ]) =>
+      _getOrNull(
+        floatingActionButtons?.call(id),
+        floatingActionButtons?.call(id)?.copyWith,
+      );
 }
diff --git a/packages/wyatt_ui_layout/lib/src/presentation/layouts/structural_layouts/frame_layout.dart b/packages/wyatt_ui_layout/lib/src/presentation/layouts/structural_layouts/frame_layout.dart
index 5b1a8879..a281dd59 100644
--- a/packages/wyatt_ui_layout/lib/src/presentation/layouts/structural_layouts/frame_layout.dart
+++ b/packages/wyatt_ui_layout/lib/src/presentation/layouts/structural_layouts/frame_layout.dart
@@ -76,29 +76,37 @@ class FrameLayout extends StructuralLayout {
 
   final ScaffoldFieldsWrapper? scaffoldFieldsWrapper;
 
+  PreferredSize? _buildAppBar(BuildContext context) {
+    final appBar = customAppBar?.call(
+          context.components.topAppBarComponentOrNull(appBarId)?.call(),
+        ) ??
+        context.components.topAppBarComponentOrNull(appBarId)?.call();
+
+    return appBar != null
+        ? PreferredSize(
+            preferredSize: Size.fromHeight(height),
+            child: appBar,
+          )
+        : null;
+  }
+
   @override
   Widget build(BuildContext context) => Scaffold(
-        appBar: (customAppBar
-                    ?.call(context.components.topAppBarComponent(appBarId)()) !=
-                null)
-            ? PreferredSize(
-                preferredSize: Size.fromHeight(height),
-                child: customAppBar?.call(
-                      context.components.topAppBarComponent(appBarId)(),
-                    ) ??
-                    context.components.topAppBarComponent(appBarId)(),
-              )
-            : null,
+        appBar: _buildAppBar(context),
         floatingActionButton: customFloatingActionButton?.call(
               context.components
-                  .floatingActionButtonComponent(floatingActionButtonId)(),
+                  .floatingActionButtonComponentOrNull(floatingActionButtonId)
+                  ?.call(),
             ) ??
             context.components
-                .floatingActionButtonComponent(floatingActionButtonId)(),
+                .floatingActionButtonComponentOrNull(floatingActionButtonId)
+                ?.call(),
         bottomNavigationBar: customBottomNavBar?.call(
               context.components.bottomNavigationBarComponent(bottomNavBarId)(),
             ) ??
-            context.components.bottomNavigationBarComponent(bottomNavBarId)(),
+            context.components
+                .bottomNavigationBarComponentOrNull(bottomNavBarId)
+                ?.call(),
         body: body,
         floatingActionButtonLocation:
             scaffoldFieldsWrapper?.floatingActionButtonLocation,