feat(ui): add StreamScaffold with floating app-bar / bottom-bar support

apps/design_system_gallery/lib/app/gallery_app.directories.g.dart

@@ -110,6 +110,8 @@ import 'package:design_system_gallery/components/reaction/stream_reaction_picker
     as _design_system_gallery_components_reaction_stream_reaction_picker;
 import 'package:design_system_gallery/components/reaction/stream_reactions.dart'
     as _design_system_gallery_components_reaction_stream_reactions;
+import 'package:design_system_gallery/components/scaffold/stream_scaffold.dart'
+    as _design_system_gallery_components_scaffold_stream_scaffold;
 import 'package:design_system_gallery/components/sheet/stream_sheet.dart'
     as _design_system_gallery_components_sheet_stream_sheet;
 import 'package:design_system_gallery/components/snackbar/stream_snackbar.dart'
@@ -124,6 +126,8 @@ import 'package:design_system_gallery/components/toolbar/stream_bottom_nav_bar.d
     as _design_system_gallery_components_toolbar_stream_bottom_nav_bar;
 import 'package:design_system_gallery/components/toolbar/stream_sheet_header.dart'
     as _design_system_gallery_components_toolbar_stream_sheet_header;
+import 'package:design_system_gallery/components/toolbar/stream_toolbar_button.dart'
+    as _design_system_gallery_components_toolbar_stream_toolbar_button;
 import 'package:design_system_gallery/primitives/colors.dart'
     as _design_system_gallery_primitives_colors;
 import 'package:design_system_gallery/primitives/icons.dart'
@@ -1133,6 +1137,28 @@ final directories = <_widgetbook.WidgetbookNode>[
           ),
         ],
       ),
+      _widgetbook.WidgetbookFolder(
+        name: 'Scaffold',
+        children: [
+          _widgetbook.WidgetbookComponent(
+            name: 'StreamScaffold',
+            useCases: [
+              _widgetbook.WidgetbookUseCase(
+                name: 'Playground',
+                builder:
+                    _design_system_gallery_components_scaffold_stream_scaffold
+                        .buildStreamScaffoldPlayground,
+              ),
+              _widgetbook.WidgetbookUseCase(
+                name: 'Real-world Example',
+                builder:
+                    _design_system_gallery_components_scaffold_stream_scaffold
+                        .buildStreamScaffoldDrawers,
+              ),
+            ],
+          ),
+        ],
+      ),
       _widgetbook.WidgetbookFolder(
         name: 'Sheet',
         children: [
@@ -1268,6 +1294,23 @@ final directories = <_widgetbook.WidgetbookNode>[
               ),
             ],
           ),
+          _widgetbook.WidgetbookComponent(
+            name: 'StreamToolbarButton',
+            useCases: [
+              _widgetbook.WidgetbookUseCase(
+                name: 'Playground',
+                builder:
+                    _design_system_gallery_components_toolbar_stream_toolbar_button
+                        .buildStreamToolbarButtonPlayground,
+              ),
+              _widgetbook.WidgetbookUseCase(
+                name: 'Real-world Example',
+                builder:
+                    _design_system_gallery_components_toolbar_stream_toolbar_button
+                        .buildStreamToolbarButtonRealWorld,
+              ),
+            ],
+          ),
         ],
       ),
     ],

apps/design_system_gallery/lib/components/media_viewer/stream_media_viewer.dart

@@ -41,22 +41,41 @@ Widget buildStreamMediaViewerPlayground(BuildContext context) {
     description: 'Duration of the chrome show/hide animation.',
   );
 
+  final surfaceStyle = context.knobs.object.dropdown(
+    label: 'Chrome surfaceStyle',
+    options: StreamSurfaceStyle.values,
+    initialOption: StreamSurfaceStyle.floating,
+    description:
+        'Floating chrome overlays full-bleed media with a gradient fade; '
+        'regular chrome insets the media between opaque bars.',
+  );
+
   final tintChrome = context.knobs.boolean(
     label: 'Tint chrome over dark media',
     description:
         'Demonstrates StreamMediaViewerThemeData.appBarStyle / '
-        'bottomAppBarStyle — scopes a translucent chrome over the media.',
+        'bottomAppBarStyle — scopes a translucent chrome colour over the media.',
   );
 
+  final tint = tintChrome ? const Color(0x55000000) : null;
+
   return _MediaViewerLauncher(
     label: 'Open media viewer',
     onPressed: (launchContext) => _push(
       launchContext,
       StreamMediaViewerTheme(
         data: StreamMediaViewerThemeData(
           chromeAnimationDuration: Duration(milliseconds: animationMs.round()),
-          appBarStyle: tintChrome ? const StreamAppBarStyle(backgroundColor: Color(0x55000000)) : null,
-          bottomAppBarStyle: tintChrome ? const StreamBottomAppBarStyle(backgroundColor: Color(0x55000000)) : null,
+          appBarStyle: StreamAppBarStyle(
+            surfaceStyle: surfaceStyle,
+            backgroundColor: tint,
+            floatingBackgroundColor: tint,
+          ),
+          bottomAppBarStyle: StreamBottomAppBarStyle(
+            surfaceStyle: surfaceStyle,
+            backgroundColor: tint,
+            floatingBackgroundColor: tint,
+          ),
         ),
         child: _PlaygroundMediaViewer(
           showHeader: showHeader,