imp: icons optimization

CONTRIBUTING.md

@@ -0,0 +1,33 @@
+# Contributing to Suggest a Feature
+
+This document provides guidelines and information for developers working on this package.
+
+## Working with SVG Assets
+
+This package uses the `vector_graphics` package for rendering SVG icons. Because `vector_graphics` transformers don't work across package boundaries, we pre-compile all SVG assets into `.vec` format.
+
+### Adding or Modifying SVG Assets
+
+When you add new SVG files or modify existing ones in the `assets/` directory, you must re-compile them:
+
+**Step 1:** Add or update your SVG file in `assets/`
+
+**Step 2:** Run the compilation script:
+```bash
+dart run scripts/compile_svgs.dart
+```
+
+**Step 3:** Reference the compiled asset in code:
+```dart
+// In assets_strings.dart
+static const String myIcon = 'assets/compiled/my_icon.svg.vec';
+```
+
+### Why Pre-compilation is Required
+
+The `vector_graphics_compiler` package uses asset transformers that only work in application projects, not in library packages. By pre-compiling our SVG assets during development, we ensure that:
+- Package users only need the `vector_graphics` runtime dependency
+- Users don't need to add `vector_graphics_compiler` or configure transformers
+- Assets are optimized for faster rendering
+
+**Important:** Always commit both the source `.svg` files and the compiled `.vec` files to the repository.

example/pubspec.lock

@@ -1,14 +1,6 @@
 # Generated by pub
 # See https://dart.dev/tools/pub/glossary#lockfile
 packages:
-  args:
-    dependency: transitive
-    description:
-      name: args
-      sha256: d0481093c50b1da8910eb0bb301626d4d8eb7284aa739614d2b394ee09e3ea04
-      url: "https://pub.dev"
-    source: hosted
-    version: "2.7.0"
   async:
     dependency: transitive
     description:
@@ -86,14 +78,6 @@ packages:
       url: "https://pub.dev"
     source: hosted
     version: "2.0.3"
-  flutter_svg:
-    dependency: transitive
-    description:
-      name: flutter_svg
-      sha256: cd57f7969b4679317c17af6fd16ee233c1e60a82ed209d8a475c54fd6fd6f845
-      url: "https://pub.dev"
-    source: hosted
-    version: "2.2.0"
   flutter_test:
     dependency: "direct dev"
     description: flutter
@@ -187,22 +171,6 @@ packages:
       url: "https://pub.dev"
     source: hosted
     version: "1.9.1"
-  path_parsing:
-    dependency: transitive
-    description:
-      name: path_parsing
-      sha256: "883402936929eac138ee0a45da5b0f2c80f89913e6dc3bf77eb65b84b409c6ca"
-      url: "https://pub.dev"
-    source: hosted
-    version: "1.1.0"
-  petitparser:
-    dependency: transitive
-    description:
-      name: petitparser
-      sha256: "07c8f0b1913bcde1ff0d26e57ace2f3012ccbf2b204e070290dad3bb22797646"
-      url: "https://pub.dev"
-    source: hosted
-    version: "6.1.0"
   sky_engine:
     dependency: transitive
     description: flutter
@@ -287,14 +255,6 @@ packages:
       url: "https://pub.dev"
     source: hosted
     version: "1.1.13"
-  vector_graphics_compiler:
-    dependency: transitive
-    description:
-      name: vector_graphics_compiler
-      sha256: "557a315b7d2a6dbb0aaaff84d857967ce6bdc96a63dc6ee2a57ce5a6ee5d3331"
-      url: "https://pub.dev"
-    source: hosted
-    version: "1.1.17"
   vector_math:
     dependency: transitive
     description:
@@ -327,14 +287,6 @@ packages:
       url: "https://pub.dev"
     source: hosted
     version: "1.1.5"
-  xml:
-    dependency: transitive
-    description:
-      name: xml
-      sha256: b015a8ad1c488f66851d762d3090a21c600e479dc75e68328c52774040cf9226
-      url: "https://pub.dev"
-    source: hosted
-    version: "6.5.0"
 sdks:
   dart: ">=3.7.0-0 <4.0.0"
   flutter: ">=3.27.0"

lib/src/presentation/pages/suggestion/create_edit/create_edit_suggestion_bottom_sheet.dart

@@ -1,5 +1,4 @@
 import 'package:flutter/material.dart';
-import 'package:flutter_svg/svg.dart';
 import 'package:suggest_a_feature/src/domain/entities/suggestion.dart';
 import 'package:suggest_a_feature/src/presentation/di/injector.dart';
 import 'package:suggest_a_feature/src/presentation/localization/localization_extensions.dart';
@@ -15,6 +14,7 @@ import 'package:suggest_a_feature/src/presentation/pages/widgets/network_image.d
 import 'package:suggest_a_feature/src/presentation/pages/widgets/photo_view.dart';
 import 'package:suggest_a_feature/src/presentation/pages/widgets/small_photo_preview.dart';
 import 'package:suggest_a_feature/src/presentation/pages/widgets/state_listener.dart';
+import 'package:suggest_a_feature/src/presentation/pages/widgets/suggestions_icon.dart';
 import 'package:suggest_a_feature/src/presentation/pages/widgets/suggestions_labels.dart';
 import 'package:suggest_a_feature/src/presentation/pages/widgets/suggestions_switch.dart';
 import 'package:suggest_a_feature/src/presentation/pages/widgets/suggestions_text_field.dart';
@@ -256,14 +256,10 @@ class _LabelItems extends StatelessWidget {
       ),
       trailing: labels.isNotEmpty
           ? SuggestionLabels(labels: labels)
-          : SvgPicture.asset(
+          : SuggestionsIcon(
               AssetStrings.plusIconThickImage,
-              package: AssetStrings.packageName,
-              colorFilter: ColorFilter.mode(
-                context.theme.colorScheme.onSurface,
-                BlendMode.srcIn,
-              ),
-              height: Dimensions.defaultSize,
+              color: context.theme.colorScheme.onSurface,
+              size: Dimensions.defaultSize,
             ),
       onClick: () => changeLabelsBottomSheetStatus(true),
       verticalPadding: Dimensions.marginDefault,
@@ -521,14 +517,10 @@ class _AddButton extends StatelessWidget {
                 context.theme.colorScheme.onSurface,
               ),
             )
-          : SvgPicture.asset(
+          : SuggestionsIcon(
               AssetStrings.plusIconThickImage,
-              package: AssetStrings.packageName,
-              colorFilter: ColorFilter.mode(
-                context.theme.colorScheme.onSurface,
-                BlendMode.srcIn,
-              ),
-              height: isSmall ? Dimensions.smallSize : Dimensions.defaultSize,
+              color: context.theme.colorScheme.onSurface,
+              size: isSmall ? Dimensions.smallSize : Dimensions.defaultSize,
             ),
       onClick: onUploadPhotos,
       verticalPadding: Dimensions.marginDefault,

lib/src/presentation/pages/suggestion/suggestion_page.dart

@@ -1,5 +1,4 @@
 import 'package:flutter/material.dart';
-import 'package:flutter_svg/flutter_svg.dart';
 import 'package:suggest_a_feature/src/domain/entities/admin_settings.dart';
 import 'package:suggest_a_feature/src/domain/entities/comment.dart';
 import 'package:suggest_a_feature/src/domain/entities/suggestion.dart';
@@ -20,6 +19,7 @@ import 'package:suggest_a_feature/src/presentation/pages/widgets/icon_button.dar
 import 'package:suggest_a_feature/src/presentation/pages/widgets/network_image.dart';
 import 'package:suggest_a_feature/src/presentation/pages/widgets/photo_view.dart';
 import 'package:suggest_a_feature/src/presentation/pages/widgets/state_listener.dart';
+import 'package:suggest_a_feature/src/presentation/pages/widgets/suggestions_icon.dart';
 import 'package:suggest_a_feature/src/presentation/pages/widgets/suggestions_labels.dart';
 import 'package:suggest_a_feature/src/presentation/pages/widgets/votes_counter.dart';
 import 'package:suggest_a_feature/src/presentation/utils/assets_strings.dart';
@@ -834,13 +834,9 @@ class _UpvoteButton extends StatelessWidget {
             child: Row(
               mainAxisAlignment: MainAxisAlignment.center,
               children: [
-                SvgPicture.asset(
+                SuggestionsIcon(
                   AssetStrings.suggestionsUpvoteArrow,
-                  package: AssetStrings.packageName,
-                  colorFilter: ColorFilter.mode(
-                    context.theme.colorScheme.onPrimary,
-                    BlendMode.srcIn,
-                  ),
+                  color: context.theme.colorScheme.onPrimary,
                 ),
                 const SizedBox(width: Dimensions.marginSmall),
                 Flexible(

lib/src/presentation/pages/suggestions/widgets/list_description.dart

@@ -1,7 +1,7 @@
 import 'package:flutter/material.dart';
-import 'package:flutter_svg/svg.dart';
 import 'package:suggest_a_feature/src/presentation/localization/localization_extensions.dart';
 import 'package:suggest_a_feature/src/presentation/pages/theme/theme_extension.dart';
+import 'package:suggest_a_feature/src/presentation/pages/widgets/suggestions_icon.dart';
 import 'package:suggest_a_feature/src/presentation/utils/assets_strings.dart';
 import 'package:suggest_a_feature/src/presentation/utils/dimensions.dart';
 import 'package:suggest_a_feature/suggest_a_feature.dart';
@@ -111,13 +111,9 @@ class ListDescription extends StatelessWidget {
                             overflow: TextOverflow.ellipsis,
                           ),
                         ),
-                        SvgPicture.asset(
+                        SuggestionsIcon(
                           AssetStrings.arrowDownIcon,
-                          package: AssetStrings.packageName,
-                          colorFilter: ColorFilter.mode(
-                            context.theme.colorScheme.primary,
-                            BlendMode.srcIn,
-                          ),
+                          color: context.theme.colorScheme.primary,
                         ),
                       ],
                     ),

lib/src/presentation/pages/suggestions/widgets/suggestions_tab_bar.dart

@@ -1,7 +1,7 @@
 import 'package:flutter/material.dart';
-import 'package:flutter_svg/svg.dart';
 import 'package:suggest_a_feature/src/presentation/localization/localization_extensions.dart';
 import 'package:suggest_a_feature/src/presentation/pages/theme/theme_extension.dart';
+import 'package:suggest_a_feature/src/presentation/pages/widgets/suggestions_icon.dart';
 import 'package:suggest_a_feature/src/presentation/utils/assets_strings.dart';
 import 'package:suggest_a_feature/src/presentation/utils/dimensions.dart';
 import 'package:suggest_a_feature/suggest_a_feature.dart';
@@ -109,15 +109,11 @@ class _TabIcon extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     return SizedBox(
-      child: SvgPicture.asset(
+      child: SuggestionsIcon(
         iconPath,
-        package: AssetStrings.packageName,
-        colorFilter: ColorFilter.mode(
-          isActive
-              ? context.theme.colorScheme.onSurface
-              : context.theme.colorScheme.onSurfaceVariant,
-          BlendMode.srcIn,
-        ),
+        color: isActive
+            ? context.theme.colorScheme.onSurface
+            : context.theme.colorScheme.onSurfaceVariant,
       ),
     );
   }

lib/src/presentation/pages/widgets/add_event_photo_button.dart

@@ -1,8 +1,8 @@
 import 'package:flutter/material.dart';
-import 'package:flutter_svg/flutter_svg.dart';
 import 'package:suggest_a_feature/src/presentation/localization/localization_extensions.dart';
 import 'package:suggest_a_feature/src/presentation/pages/theme/theme_extension.dart';
 import 'package:suggest_a_feature/src/presentation/pages/widgets/dotted_border.dart';
+import 'package:suggest_a_feature/src/presentation/pages/widgets/suggestions_icon.dart';
 import 'package:suggest_a_feature/src/presentation/utils/assets_strings.dart';
 import 'package:suggest_a_feature/src/presentation/utils/dimensions.dart';
 
@@ -59,14 +59,10 @@ class _AddButton extends StatelessWidget {
     return Column(
       mainAxisAlignment: MainAxisAlignment.center,
       children: <Widget>[
-        SvgPicture.asset(
+        SuggestionsIcon(
           AssetStrings.addPhotoButton,
-          package: AssetStrings.packageName,
-          height: Dimensions.defaultSize,
-          colorFilter: ColorFilter.mode(
-            context.theme.colorScheme.onSurface,
-            BlendMode.srcIn,
-          ),
+          color: context.theme.colorScheme.onSurface,
+          size: Dimensions.defaultSize,
         ),
         Padding(
           padding: const EdgeInsets.only(top: Dimensions.marginSmall),

lib/src/presentation/pages/widgets/avatar_widget.dart

@@ -1,7 +1,7 @@
 import 'package:flutter/material.dart';
-import 'package:flutter_svg/flutter_svg.dart';
 import 'package:suggest_a_feature/src/presentation/pages/theme/theme_extension.dart';
 import 'package:suggest_a_feature/src/presentation/pages/widgets/network_image.dart';
+import 'package:suggest_a_feature/src/presentation/pages/widgets/suggestions_icon.dart';
 import 'package:suggest_a_feature/src/presentation/utils/assets_strings.dart';
 import 'package:suggest_a_feature/src/presentation/utils/dimensions.dart';
 
@@ -34,13 +34,9 @@ class AvatarWidget extends StatelessWidget {
             ? SuggestionsNetworkImage(url: avatar!)
             : Padding(
                 padding: EdgeInsets.all(iconPadding),
-                child: SvgPicture.asset(
+                child: SuggestionsIcon(
                   AssetStrings.profileIconImage,
-                  package: AssetStrings.packageName,
-                  colorFilter: ColorFilter.mode(
-                    context.theme.colorScheme.onSurface,
-                    BlendMode.srcIn,
-                  ),
+                  color: context.theme.colorScheme.onSurface,
                 ),
               ),
       ),

lib/src/presentation/pages/widgets/bottom_sheets/confirmation_bottom_sheet.dart

@@ -1,8 +1,8 @@
 import 'package:flutter/material.dart';
-import 'package:flutter_svg/flutter_svg.dart';
 import 'package:suggest_a_feature/src/presentation/pages/theme/theme_extension.dart';
 import 'package:suggest_a_feature/src/presentation/pages/widgets/bottom_sheets/base_bottom_sheet.dart';
 import 'package:suggest_a_feature/src/presentation/pages/widgets/clickable_list_item.dart';
+import 'package:suggest_a_feature/src/presentation/pages/widgets/suggestions_icon.dart';
 import 'package:suggest_a_feature/src/presentation/utils/assets_strings.dart';
 import 'package:suggest_a_feature/src/presentation/utils/dimensions.dart';
 import 'package:wtf_sliding_sheet/wtf_sliding_sheet.dart';
@@ -144,15 +144,10 @@ class _Confirm extends StatelessWidget {
   Widget build(BuildContext context) {
     return ClickableListItem(
       onClick: onConfirm,
-      leading: SvgPicture.asset(
+      leading: SuggestionsIcon(
         onConfirmAsset,
-        package: AssetStrings.packageName,
-        width: Dimensions.defaultSize,
-        height: Dimensions.defaultSize,
-        colorFilter: ColorFilter.mode(
-          context.theme.colorScheme.error,
-          BlendMode.srcIn,
-        ),
+        size: Dimensions.defaultSize,
+        color: context.theme.colorScheme.error,
       ),
       title: Text(
         onConfirmText,
@@ -178,15 +173,10 @@ class _Cancel extends StatelessWidget {
   Widget build(BuildContext context) {
     return ClickableListItem(
       onClick: onCancel,
-      leading: SvgPicture.asset(
+      leading: SuggestionsIcon(
         AssetStrings.closeIconImage,
-        package: AssetStrings.packageName,
-        width: Dimensions.defaultSize,
-        height: Dimensions.defaultSize,
-        colorFilter: ColorFilter.mode(
-          context.theme.colorScheme.onSurface,
-          BlendMode.srcIn,
-        ),
+        size: Dimensions.defaultSize,
+        color: context.theme.colorScheme.onSurface,
       ),
       title: Text(
         onCancelText,