[flutter_markdown] Fix custom block building used for block syntaxes.

* Earlier, `builders` were assumed to be used only with inline syntaxes, therefore builders with BlockSyntax was totally broken
(flutter/flutter#81724)
* Added another named argument, `blockBuilders` specifically for BlockSyntax.
* Preferred TextStyle for custom BlockSyntax will be null. Therefore, it's expected that preferredStyle in MarkdownBlockBuilder is nullable.

Signed-off-by: Manjot Sidhu <[email protected]>

packages/flutter_markdown/lib/src/builder.dart

@@ -101,6 +101,7 @@ class MarkdownBuilder implements md.NodeVisitor {
     required this.checkboxBuilder,
     required this.bulletBuilder,
     required this.builders,
+    required this.blockBuilders,
     required this.listItemCrossAxisAlignment,
     this.fitContent = false,
     this.onTapText,
@@ -129,9 +130,12 @@ class MarkdownBuilder implements md.NodeVisitor {
   /// Called when building a custom bullet.
   final MarkdownBulletBuilder? bulletBuilder;
 
-  /// Call when build a custom widget.
+  /// Call when build a custom inline widget.
   final Map<String, MarkdownElementBuilder> builders;
 
+  /// Call when build a custom block widget.
+  final Map<String, MarkdownElementBuilder> blockBuilders;
+
   /// Whether to allow the widget to fit the child content.
   final bool fitContent;
 
@@ -188,7 +192,7 @@ class MarkdownBuilder implements md.NodeVisitor {
     }
 
     int? start;
-    if (_isBlockTag(tag)) {
+    if (_isBlockTag(tag) || blockBuilders.containsKey(tag)) {
       _addAnonymousBlockIfNeeded();
       if (_isListTag(tag)) {
         _listIndents.add(tag);
@@ -245,10 +249,10 @@ class MarkdownBuilder implements md.NodeVisitor {
         element.children!.add(md.Text(''));
       }
 
-      final TextStyle parentStyle = _inlines.last.style!;
+      final TextStyle? parentStyle = _inlines.last.style;
       _inlines.add(_InlineElement(
         tag,
-        style: parentStyle.merge(styleSheet.styles[tag]),
+        style: parentStyle?.merge(styleSheet.styles[tag]),
       ));
     }
 
@@ -333,7 +337,7 @@ class MarkdownBuilder implements md.NodeVisitor {
   void visitElementAfter(md.Element element) {
     final String tag = element.tag;
 
-    if (_isBlockTag(tag)) {
+    if (_isBlockTag(tag) || blockBuilders.containsKey(tag)) {
       _addAnonymousBlockIfNeeded();
 
       final _BlockElement current = _blocks.removeLast();
@@ -409,6 +413,8 @@ class MarkdownBuilder implements md.NodeVisitor {
         );
       } else if (tag == 'hr') {
         child = Container(decoration: styleSheet.horizontalRuleDecoration);
+      } else if (blockBuilders.containsKey(tag)) {
+        child = blockBuilders[tag]!.visitElementAfter(element, styleSheet.styles[tag])!;
       }
 
       _addBlockChild(child);
@@ -568,7 +574,7 @@ class MarkdownBuilder implements md.NodeVisitor {
     if (_inlines.isEmpty) {
       _inlines.add(_InlineElement(
         tag,
-        style: styleSheet.styles[tag!],
+        style: styleSheet.styles.containsKey(tag) ? styleSheet.styles[tag!] : null,
       ));
     }
   }
@@ -589,7 +595,7 @@ class MarkdownBuilder implements md.NodeVisitor {
 
     WrapAlignment blockAlignment = WrapAlignment.start;
     TextAlign textAlign = TextAlign.start;
-    if (_isBlockTag(_currentBlockTag)) {
+    if (_isBlockTag(_currentBlockTag) || blockBuilders.containsKey(_currentBlockTag)) {
       blockAlignment = _wrapAlignmentForBlockTag(_currentBlockTag);
       textAlign = _textAlignForBlockTag(_currentBlockTag);
     }

packages/flutter_markdown/lib/src/widget.dart

@@ -167,6 +167,7 @@ abstract class MarkdownWidget extends StatefulWidget {
     this.checkboxBuilder,
     this.bulletBuilder,
     this.builders = const <String, MarkdownElementBuilder>{},
+    this.blockBuilders = const <String, MarkdownElementBuilder>{},
     this.fitContent = false,
     this.listItemCrossAxisAlignment =
         MarkdownListItemCrossAxisAlignment.baseline,
@@ -224,7 +225,7 @@ abstract class MarkdownWidget extends StatefulWidget {
   /// Called when building a bullet
   final MarkdownBulletBuilder? bulletBuilder;
 
-  /// Render certain tags, usually used with [extensionSet]
+  /// Render certain inline tags, usually used with [extensionSet]
   ///
   /// For example, we will add support for `sub` tag:
   ///
@@ -237,6 +238,19 @@ abstract class MarkdownWidget extends StatefulWidget {
   /// The `SubscriptBuilder` is a subclass of [MarkdownElementBuilder].
   final Map<String, MarkdownElementBuilder> builders;
 
+  /// Render certain block tags, usually used with custom block syntaxes
+  ///
+  /// For example, we will add support for `iframe` tag:
+  ///
+  /// ```dart
+  /// blockBuilders: {
+  ///   'iframe': IframeBuilder(),
+  /// }
+  /// ```
+  ///
+  /// The `IframeBuilder` is a subclass of [MarkdownElementBuilder].
+  final Map<String, MarkdownElementBuilder> blockBuilders;
+
   /// Whether to allow the widget to fit the child content.
   final bool fitContent;
 
@@ -313,6 +327,7 @@ class _MarkdownWidgetState extends State<MarkdownWidget>
       checkboxBuilder: widget.checkboxBuilder,
       bulletBuilder: widget.bulletBuilder,
       builders: widget.builders,
+      blockBuilders: widget.blockBuilders,
       fitContent: widget.fitContent,
       listItemCrossAxisAlignment: widget.listItemCrossAxisAlignment,
       onTapText: widget.onTapText,
@@ -386,6 +401,8 @@ class MarkdownBody extends MarkdownWidget {
     MarkdownBulletBuilder? bulletBuilder,
     Map<String, MarkdownElementBuilder> builders =
         const <String, MarkdownElementBuilder>{},
+    Map<String, MarkdownElementBuilder> blockBuilders =
+        const <String, MarkdownElementBuilder>{},
     MarkdownListItemCrossAxisAlignment listItemCrossAxisAlignment =
         MarkdownListItemCrossAxisAlignment.baseline,
     this.shrinkWrap = true,
@@ -406,6 +423,7 @@ class MarkdownBody extends MarkdownWidget {
           imageBuilder: imageBuilder,
           checkboxBuilder: checkboxBuilder,
           builders: builders,
+          blockBuilders: blockBuilders,
           listItemCrossAxisAlignment: listItemCrossAxisAlignment,
           bulletBuilder: bulletBuilder,
           fitContent: fitContent,