diff --git a/examples/simple_chat/lib/main.dart b/examples/simple_chat/lib/main.dart index b6d495589..20df945bc 100644 --- a/examples/simple_chat/lib/main.dart +++ b/examples/simple_chat/lib/main.dart @@ -145,7 +145,24 @@ ${GenUiPromptFragments.basicChat}'''; }; return Scaffold( - appBar: AppBar(title: Text(title)), + appBar: AppBar( + title: Text(title), + actions: [ + Row( + children: [ + const Text('Padding'), + Switch( + value: DebugFlags.enableLeafPadding, + onChanged: (value) { + setState(() { + DebugFlags.enableLeafPadding = value; + }); + }, + ), + ], + ), + ], + ), body: SafeArea( child: Column( children: [ diff --git a/packages/genui/lib/genui.dart b/packages/genui/lib/genui.dart index bbe293e8a..35cebee6a 100644 --- a/packages/genui/lib/genui.dart +++ b/packages/genui/lib/genui.dart @@ -10,6 +10,7 @@ library; export 'src/catalog/core_catalog.dart'; +export 'src/catalog/core_widgets/widget_helpers.dart'; export 'src/content_generator.dart'; export 'src/core/a2ui_message_processor.dart'; export 'src/core/genui_surface.dart'; diff --git a/packages/genui/lib/src/catalog/core_widgets/button.dart b/packages/genui/lib/src/catalog/core_widgets/button.dart index 6de2f2857..fe5f679de 100644 --- a/packages/genui/lib/src/catalog/core_widgets/button.dart +++ b/packages/genui/lib/src/catalog/core_widgets/button.dart @@ -13,6 +13,7 @@ import '../../model/catalog_item.dart'; import '../../model/ui_models.dart'; import '../../primitives/logging.dart'; import '../../primitives/simple_items.dart'; +import 'widget_helpers.dart'; final _schema = S.object( properties: { @@ -87,6 +88,7 @@ final button = CatalogItem( foregroundColor: primary ? colorScheme.onPrimary : colorScheme.onSurface, + padding: DebugFlags.enableLeafPadding ? EdgeInsets.zero : null, ).copyWith(textStyle: WidgetStatePropertyAll(textStyle)), onPressed: () { final JsonMap resolvedContext = resolveContext( diff --git a/packages/genui/lib/src/catalog/core_widgets/card.dart b/packages/genui/lib/src/catalog/core_widgets/card.dart index 9320d9b21..456a1689e 100644 --- a/packages/genui/lib/src/catalog/core_widgets/card.dart +++ b/packages/genui/lib/src/catalog/core_widgets/card.dart @@ -8,6 +8,7 @@ import 'package:json_schema_builder/json_schema_builder.dart'; import '../../model/a2ui_schemas.dart'; import '../../model/catalog_item.dart'; import '../../primitives/simple_items.dart'; +import 'widget_helpers.dart'; final _schema = S.object( properties: {'child': A2uiSchemas.componentReference()}, @@ -37,10 +38,12 @@ final card = CatalogItem( final cardData = _CardData.fromMap(itemContext.data as JsonMap); return Card( color: Theme.of(itemContext.buildContext).colorScheme.surface, - child: Padding( - padding: const EdgeInsets.all(8.0), - child: itemContext.buildChild(cardData.child), - ), + child: DebugFlags.enableLeafPadding + ? itemContext.buildChild(cardData.child) + : Padding( + padding: const EdgeInsets.all(8.0), + child: itemContext.buildChild(cardData.child), + ), ); }, exampleData: [ diff --git a/packages/genui/lib/src/catalog/core_widgets/image.dart b/packages/genui/lib/src/catalog/core_widgets/image.dart index 079814bbd..e2557760b 100644 --- a/packages/genui/lib/src/catalog/core_widgets/image.dart +++ b/packages/genui/lib/src/catalog/core_widgets/image.dart @@ -10,6 +10,7 @@ import '../../model/a2ui_schemas.dart'; import '../../model/catalog_item.dart'; import '../../primitives/logging.dart'; import '../../primitives/simple_items.dart'; +import 'widget_helpers.dart'; Schema _schema({required bool enableUsageHint}) { final Map properties = { @@ -127,6 +128,13 @@ CatalogItem _imageCatalogItem({ _ => 150.0, }; + if (DebugFlags.enableLeafPadding) { + return Padding( + padding: kDefaultLeafComponentPadding, + child: SizedBox(width: size, height: size, child: child), + ); + } + return SizedBox(width: size, height: size, child: child); }, ); diff --git a/packages/genui/lib/src/catalog/core_widgets/text.dart b/packages/genui/lib/src/catalog/core_widgets/text.dart index 9bc32aedc..aee37032a 100644 --- a/packages/genui/lib/src/catalog/core_widgets/text.dart +++ b/packages/genui/lib/src/catalog/core_widgets/text.dart @@ -10,6 +10,7 @@ import '../../core/widget_utilities.dart'; import '../../model/a2ui_schemas.dart'; import '../../model/catalog_item.dart'; import '../../primitives/simple_items.dart'; +import 'widget_helpers.dart'; extension type _TextData.fromMap(JsonMap _json) { factory _TextData({required JsonMap text, String? usageHint}) => @@ -90,6 +91,26 @@ final text = CatalogItem( _ => 0.0, }; + if (DebugFlags.enableLeafPadding) { + final EdgeInsets padding = switch (usageHint) { + 'h1' || 'h2' || 'h3' => kDefaultLeafComponentPadding.copyWith( + top: 24.0, + bottom: 12.0, + ), + _ => kDefaultLeafComponentPadding, + }; + + return Padding( + padding: padding, + child: MarkdownBody( + data: currentValue ?? '', + styleSheet: MarkdownStyleSheet.fromTheme( + Theme.of(context), + ).copyWith(p: baseStyle), + ), + ); + } + return Padding( padding: EdgeInsets.symmetric(vertical: verticalPadding), child: MarkdownBody( diff --git a/packages/genui/lib/src/catalog/core_widgets/text_field.dart b/packages/genui/lib/src/catalog/core_widgets/text_field.dart index 0953b8002..9dba105d3 100644 --- a/packages/genui/lib/src/catalog/core_widgets/text_field.dart +++ b/packages/genui/lib/src/catalog/core_widgets/text_field.dart @@ -11,6 +11,7 @@ import '../../model/catalog_item.dart'; import '../../model/data_model.dart'; import '../../model/ui_models.dart'; import '../../primitives/simple_items.dart'; +import 'widget_helpers.dart'; final _schema = S.object( description: 'A text input field.', @@ -181,7 +182,7 @@ final textField = CatalogItem( return ValueListenableBuilder( valueListenable: labelNotifier, builder: (context, label, child) { - return _TextField( + final textFieldWidget = _TextField( initialValue: currentValue ?? '', label: label, textFieldType: textFieldData.textFieldType, @@ -212,6 +213,14 @@ final textField = CatalogItem( ); }, ); + + if (DebugFlags.enableLeafPadding) { + return Padding( + padding: kDefaultLeafComponentPadding, + child: textFieldWidget, + ); + } + return textFieldWidget; }, ); }, diff --git a/packages/genui/lib/src/catalog/core_widgets/widget_helpers.dart b/packages/genui/lib/src/catalog/core_widgets/widget_helpers.dart index 80052745b..53b75bc50 100644 --- a/packages/genui/lib/src/catalog/core_widgets/widget_helpers.dart +++ b/packages/genui/lib/src/catalog/core_widgets/widget_helpers.dart @@ -9,6 +9,15 @@ import '../../model/data_model.dart'; import '../../primitives/logging.dart'; import '../../primitives/simple_items.dart'; +const EdgeInsets kDefaultLeafComponentPadding = EdgeInsets.symmetric( + horizontal: 16.0, + vertical: 12.0, +); + +class DebugFlags { + static bool enableLeafPadding = true; +} + /// Builder function for creating a widget from a template and a list of data. /// /// This is used by [ComponentChildrenBuilder] when children are defined by a