Add color parameter to Toolbar and ImageButton

In addition, change these widgets to stateless widgets, since these
widgets do not have a state and thus stateful is superfluous.

lib/src/widgets/toolbar.dart

@@ -40,10 +40,11 @@ const double kDefaultIconSize = 18;
 // The factor of how much larger the button is in relation to the icon.
 const double kIconButtonFactor = 1.77;
 
-class QuillToolbar extends StatefulWidget implements PreferredSizeWidget {
+class QuillToolbar extends StatelessWidget implements PreferredSizeWidget {
   const QuillToolbar({
     required this.children,
     this.toolBarHeight = 36,
+    this.color,
     Key? key,
   }) : super(key: key);
 
@@ -306,20 +307,21 @@ class QuillToolbar extends StatefulWidget implements PreferredSizeWidget {
   final List<Widget> children;
   final double toolBarHeight;
 
-  @override
-  _QuillToolbarState createState() => _QuillToolbarState();
+  /// The color of the toolbar.
+  ///
+  /// Defaults to [ThemeData.canvasColor] of the current [Theme] if no color
+  /// is given.
+  final Color? color;
 
   @override
   Size get preferredSize => Size.fromHeight(toolBarHeight);
-}
 
-class _QuillToolbarState extends State<QuillToolbar> {
   @override
   Widget build(BuildContext context) {
     return Container(
-      constraints: BoxConstraints.tightFor(height: widget.preferredSize.height),
-      color: Theme.of(context).canvasColor,
-      child: ArrowIndicatedButtonList(buttons: widget.children),
+      constraints: BoxConstraints.tightFor(height: preferredSize.height),
+      color: color ?? Theme.of(context).canvasColor,
+      child: ArrowIndicatedButtonList(buttons: children),
     );
   }
 }

lib/src/widgets/toolbar/image_button.dart

@@ -12,12 +12,13 @@ import '../controller.dart';
 import '../toolbar.dart';
 import 'quill_icon_button.dart';
 
-class ImageButton extends StatefulWidget {
+class ImageButton extends StatelessWidget {
   const ImageButton({
     required this.icon,
     required this.controller,
     required this.imageSource,
     this.iconSize = kDefaultIconSize,
+    this.fillColor,
     this.onImagePickCallback,
     this.imagePickImpl,
     Key? key,
@@ -26,6 +27,8 @@ class ImageButton extends StatefulWidget {
   final IconData icon;
   final double iconSize;
 
+  final Color? fillColor;
+
   final QuillController controller;
 
   final OnImagePickCallback? onImagePickCallback;
@@ -34,49 +37,39 @@ class ImageButton extends StatefulWidget {
 
   final ImageSource imageSource;
 
-  @override
-  _ImageButtonState createState() => _ImageButtonState();
-}
-
-class _ImageButtonState extends State<ImageButton> {
   @override
   Widget build(BuildContext context) {
     final theme = Theme.of(context);
 
     return QuillIconButton(
-      icon: Icon(
-        widget.icon,
-        size: widget.iconSize,
-        color: theme.iconTheme.color,
-      ),
+      icon: Icon(icon, size: iconSize, color: theme.iconTheme.color),
       highlightElevation: 0,
       hoverElevation: 0,
-      size: widget.iconSize * 1.77,
-      fillColor: theme.canvasColor,
-      onPressed: _handleImageButtonTap,
+      size: iconSize * 1.77,
+      fillColor: fillColor ?? theme.canvasColor,
+      onPressed: () => _handleImageButtonTap(context),
     );
   }
 
-  Future<void> _handleImageButtonTap() async {
-    final index = widget.controller.selection.baseOffset;
-    final length = widget.controller.selection.extentOffset - index;
+  Future<void> _handleImageButtonTap(BuildContext context) async {
+    final index = controller.selection.baseOffset;
+    final length = controller.selection.extentOffset - index;
 
     String? imageUrl;
-    if (widget.imagePickImpl != null) {
-      imageUrl = await widget.imagePickImpl!(widget.imageSource);
+    if (imagePickImpl != null) {
+      imageUrl = await imagePickImpl!(imageSource);
     } else {
       if (kIsWeb) {
         imageUrl = await _pickImageWeb();
       } else if (Platform.isAndroid || Platform.isIOS) {
-        imageUrl = await _pickImage(widget.imageSource);
+        imageUrl = await _pickImage(imageSource);
       } else {
-        imageUrl = await _pickImageDesktop();
+        imageUrl = await _pickImageDesktop(context);
       }
     }
 
     if (imageUrl != null) {
-      widget.controller
-          .replaceText(index, length, BlockEmbed.image(imageUrl), null);
+      controller.replaceText(index, length, BlockEmbed.image(imageUrl), null);
     }
   }
 
@@ -90,7 +83,7 @@ class _ImageButtonState extends State<ImageButton> {
     final fileName = result.files.first.name!;
     final file = File(fileName);
 
-    return widget.onImagePickCallback!(file);
+    return onImagePickCallback!(file);
   }
 
   Future<String?> _pickImage(ImageSource source) async {
@@ -99,10 +92,10 @@ class _ImageButtonState extends State<ImageButton> {
       return null;
     }
 
-    return widget.onImagePickCallback!(File(pickedFile.path));
+    return onImagePickCallback!(File(pickedFile.path));
   }
 
-  Future<String?> _pickImageDesktop() async {
+  Future<String?> _pickImageDesktop(BuildContext context) async {
     final filePath = await FilesystemPicker.open(
       context: context,
       rootDirectory: await getApplicationDocumentsDirectory(),
@@ -112,6 +105,6 @@ class _ImageButtonState extends State<ImageButton> {
     if (filePath == null || filePath.isEmpty) return null;
 
     final file = File(filePath);
-    return widget.onImagePickCallback!(file);
+    return onImagePickCallback!(file);
   }
 }