chore: allow users to supply decoration instead of only color (#1150)

lib/src/editor/block_component/base_component/background_color_mixin.dart

@@ -3,27 +3,28 @@ import 'package:flutter/material.dart';
 
 /// If you want to customize the logic of how to convert a color string to a
 ///   [Color], you can set this variable.
-typedef BlockComponentBackgroundColorDecorator = Color? Function(
+typedef BlockComponentBackgroundColorDecorator = Decoration? Function(
   Node node,
   String colorString,
 );
-BlockComponentBackgroundColorDecorator? blockComponentBackgroundColorDecorator;
+BlockComponentBackgroundColorDecorator? blockComponentDecorator;
 
 mixin BlockComponentBackgroundColorMixin {
   Node get node;
 
-  Color get backgroundColor {
+  Decoration? get decoration {
     final colorString =
         node.attributes[blockComponentBackgroundColor] as String?;
     if (colorString == null) {
-      return Colors.transparent;
+      return null;
     }
 
-    return blockComponentBackgroundColorDecorator?.call(
+    return blockComponentDecorator?.call(
           node,
           colorString,
         ) ??
-        colorString.tryToColor() ??
+        BoxDecoration(
-        Colors.transparent;
+          color: colorString.tryToColor(),
+        );
   }
 }

lib/src/editor/block_component/bulleted_list_block_component/bulleted_list_block_component.dart

@@ -162,12 +162,10 @@ class _BulletedListBlockComponentWidgetState
     );
 
     child = Container(
-      color: withBackgroundColor ? backgroundColor : null,
+      decoration: withBackgroundColor ? decoration : null,
-      child: Padding(
+      key: blockComponentKey,
-        key: blockComponentKey,
+      padding: padding,
-        padding: padding,
+      child: child,
-        child: child,
-      ),
     );
 
     child = BlockSelectionContainer(

lib/src/editor/block_component/heading_block_component/heading_block_component.dart

@@ -185,12 +185,10 @@ class _HeadingBlockComponentWidgetState
       child: child,
     );
 
-    child = Padding(
+    child = Container(
       padding: padding,
-      child: Container(
+      decoration: decoration,
-        color: backgroundColor,
+      child: child,
-        child: child,
-      ),
     );
 
     if (widget.showActions && widget.actionBuilder != null) {

lib/src/editor/block_component/numbered_list_block_component/numbered_list_block_component.dart

@@ -177,12 +177,10 @@ class _NumberedListBlockComponentWidgetState
     );
 
     child = Container(
-      color: withBackgroundColor ? backgroundColor : null,
+      key: blockComponentKey,
-      child: Padding(
+      decoration: withBackgroundColor ? decoration : null,
-        key: blockComponentKey,
+      padding: padding,
-        padding: padding,
+      child: child,
-        child: child,
-      ),
     );
 
     child = BlockSelectionContainer(

lib/src/editor/block_component/paragraph_block_component/paragraph_block_component.dart

@@ -187,12 +187,10 @@ class _ParagraphBlockComponentWidgetState
     );
 
     child = Container(
-      color: withBackgroundColor ? backgroundColor : null,
+      key: blockComponentKey,
-      child: Padding(
+      decoration: withBackgroundColor ? decoration : null,
-        key: blockComponentKey,
+      padding: padding,
-        padding: padding,
+      child: child,
-        child: child,
-      ),
     );
 
     child = BlockSelectionContainer(

lib/src/editor/block_component/quote_block_component/quote_block_component.dart

@@ -156,12 +156,10 @@ class _QuoteBlockComponentWidgetState extends State<QuoteBlockComponentWidget>
     );
 
     child = Container(
-      color: backgroundColor,
+      decoration: decoration,
-      child: Padding(
+      key: blockComponentKey,
-        key: blockComponentKey,
+      padding: padding,
-        padding: padding,
+      child: child,
-        child: child,
-      ),
     );
 
     child = BlockSelectionContainer(

lib/src/editor/block_component/todo_list_block_component/todo_list_block_component.dart

@@ -197,12 +197,10 @@ class _TodoListBlockComponentWidgetState
     );
 
     child = Container(
-      color: withBackgroundColor ? backgroundColor : null,
+      decoration: withBackgroundColor ? decoration : null,
-      child: Padding(
+      key: blockComponentKey,
-        key: blockComponentKey,
+      padding: padding,
-        padding: padding,
+      child: child,
-        child: child,
-      ),
     );
 
     child = BlockSelectionContainer(

lib/src/editor/editor_component/service/renderer/block_component_widget.dart

@@ -138,7 +138,7 @@ mixin NestedBlockComponentStatefulWidgetMixin<
         Positioned.fill(
           left: cachedLeft,
           child: Container(
-            color: backgroundColor,
+            decoration: decoration,
           ),
         ),
         NestedListWidget(