Add imageBuilder to config

Add imageBuilder to example
Fix file name typo

@@ -328,8 +328,15 @@ Markdown and LaTeX can be powerful tools for formatting text and mathematical ex
                                             RegExp(r"align\*"),
                                             (match) => "aligned");
                                       },
+                                      imageBuilder: (context, url) {
+                                        return Image.network(
+                                          url,
+                                          width: 100,
+                                          height: 100,
+                                        );
+                                      },
                                       latexBuilder:
-                                          (contex, tex, textStyle, inline) {
+                                          (context, tex, textStyle, inline) {
                                         if (tex.contains(r"\begin{tabular}")) {
                                           // return table.
                                           String tableString = "|${(RegExp(

 import 'package:flutter/material.dart';
 
-import 'markdow_config.dart';
+import 'markdown_config.dart';
 
 class LinkButton extends StatefulWidget {
   final String text;

@@ -14,6 +14,7 @@ class GptMarkdownConfig {
     this.sourceTagBuilder,
     this.highlightBuilder,
     this.linkBuilder,
+    this.imageBuilder,
     this.maxLines,
     this.overflow,
   });
@@ -55,6 +56,7 @@ class GptMarkdownConfig {
     TextStyle style,
   )?
   linkBuilder;
+  final Widget Function(BuildContext, String imageUrl)? imageBuilder;
 
   GptMarkdownConfig copyWith({
     TextStyle? style,
@@ -95,6 +97,7 @@ class GptMarkdownConfig {
       TextStyle style,
     )?
     linkBuilder,
+    final Widget Function(BuildContext, String imageUrl)? imageBuilder,
   }) {
     return GptMarkdownConfig(
       style: style ?? this.style,
@@ -111,6 +114,7 @@ class GptMarkdownConfig {
       overflow: overflow ?? this.overflow,
       highlightBuilder: highlightBuilder ?? this.highlightBuilder,
       linkBuilder: linkBuilder ?? this.linkBuilder,
+      imageBuilder: imageBuilder ?? this.imageBuilder,
     );
   }
 

 import 'package:flutter/material.dart';
-import 'package:gpt_markdown/custom_widgets/markdow_config.dart';
+import 'package:gpt_markdown/custom_widgets/markdown_config.dart';
 
 import 'package:flutter/foundation.dart';
 import 'package:flutter_math_fork/flutter_math.dart';
@@ -28,6 +28,7 @@ class GptMarkdown extends StatelessWidget {
     this.textDirection = TextDirection.ltr,
     this.latexWorkaround,
     this.textAlign,
+    this.imageBuilder,
     this.textScaler,
     this.onLinkTab,
     this.latexBuilder,
@@ -72,6 +73,7 @@ class GptMarkdown extends StatelessWidget {
     TextStyle style,
   )?
   linkBuilder;
+  final Widget Function(BuildContext, String imageUrl)? imageBuilder;
   String _removeExtraLinesInsideBlockLatex(String text) {
     return text.replaceAllMapped(
       RegExp(r"\\\[(.*?)\\\]", multiLine: true, dotAll: true),
@@ -120,6 +122,7 @@ class GptMarkdown extends StatelessWidget {
           sourceTagBuilder: sourceTagBuilder,
           highlightBuilder: highlightBuilder,
           linkBuilder: linkBuilder,
+          imageBuilder: imageBuilder,
         ),
       ),
     );

@@ -755,35 +755,37 @@ class ImageMd extends InlineMd {
       width = double.tryParse(size?[1]?.toString().trim() ?? 'a');
       height = double.tryParse(size?[2]?.toString().trim() ?? 'a');
     }
+    late final Widget image;
+    if (config.imageBuilder != null) {
+      image = config.imageBuilder!(context, '${match?[2]}');
+    } else {
+      image = Image(
+        image: NetworkImage("${match?[2]}"),
+        loadingBuilder: (
+          BuildContext context,
+          Widget child,
+          ImageChunkEvent? loadingProgress,
+        ) {
+          if (loadingProgress == null) {
+            return child;
+          }
+          return CustomImageLoading(
+            progress:
+                loadingProgress.expectedTotalBytes != null
+                    ? loadingProgress.cumulativeBytesLoaded /
+                        loadingProgress.expectedTotalBytes!
+                    : 1,
+          );
+        },
+        fit: BoxFit.fill,
+        errorBuilder: (context, error, stackTrace) {
+          return const CustomImageError();
+        },
+      );
+    }
     return WidgetSpan(
       alignment: PlaceholderAlignment.bottom,
-      child: SizedBox(
-        width: width,
-        height: height,
-        child: Image(
-          image: NetworkImage("${match?[2]}"),
-          loadingBuilder: (
-            BuildContext context,
-            Widget child,
-            ImageChunkEvent? loadingProgress,
-          ) {
-            if (loadingProgress == null) {
-              return child;
-            }
-            return CustomImageLoading(
-              progress:
-                  loadingProgress.expectedTotalBytes != null
-                      ? loadingProgress.cumulativeBytesLoaded /
-                          loadingProgress.expectedTotalBytes!
-                      : 1,
-            );
-          },
-          fit: BoxFit.fill,
-          errorBuilder: (context, error, stackTrace) {
-            return const CustomImageError();
-          },
-        ),
-      ),
+      child: SizedBox(width: width, height: height, child: image),
     );
   }
 }