✨ added stats

packages/clean_framework/example/lib/features/home/presentation/home_ui.dart

@@ -34,6 +34,7 @@ class HomeUI extends UI<HomeViewModel> {
               final pokemon = viewModel.pokemons[index];
 
               return PokemonCard(
+                key: ValueKey(pokemon.name),
                 imageUrl: pokemon.imageUrl,
                 name: pokemon.name,
                 heroTag: pokemon.name,

packages/clean_framework/example/lib/features/profile/domain/profile_entity.dart

@@ -1,33 +1,45 @@
 import 'package:clean_framework/clean_framework_core.dart';
+import 'package:clean_framework_example/features/profile/models/pokemon_profile_model.dart';
 
 class ProfileEntity extends Entity {
   ProfileEntity({
     this.types = const [],
     this.description = '',
     this.height = 0,
     this.weight = 0,
+    this.stats = const [],
   });
 
   final List<String> types;
   final String description;
   final int height;
   final int weight;
+  final List<PokemonStatModel> stats;
 
   @override
-  List<Object?> get props => [types, description, height, weight];
+  List<Object?> get props => [types, description, height, weight, stats];
 
   @override
   ProfileEntity copyWith({
     List<String>? types,
     String? description,
     int? height,
     int? weight,
+    List<PokemonStatModel>? stats,
   }) {
     return ProfileEntity(
       types: types ?? this.types,
       description: description ?? this.description,
       height: height ?? this.height,
       weight: weight ?? this.weight,
+      stats: stats ?? this.stats,
     );
   }
 }
+
+class PokemonStat {
+  PokemonStat({required this.name, required this.point});
+
+  final String name;
+  final int point;
+}

packages/clean_framework/example/lib/features/profile/domain/profile_ui_output.dart

@@ -1,18 +1,21 @@
 import 'package:clean_framework/clean_framework_core.dart';
+import 'package:clean_framework_example/features/profile/domain/profile_entity.dart';
 
 class ProfileUIOutput extends Output {
   ProfileUIOutput({
     required this.types,
     required this.description,
     required this.height,
     required this.weight,
+    required this.stats,
   });
 
   final List<String> types;
   final String description;
   final double height;
   final double weight;
+  final List<PokemonStat> stats;
 
   @override
-  List<Object?> get props => [types, description, height, weight];
+  List<Object?> get props => [types, description, height, weight, stats];
 }

packages/clean_framework/example/lib/features/profile/domain/profile_use_case.dart

@@ -41,6 +41,7 @@ class ProfileUseCase extends UseCase<ProfileEntity> {
           types: profile.types,
           height: profile.height,
           weight: profile.weight,
+          stats: profile.stats,
         );
       },
       onFailure: (failure) => entity,
@@ -54,9 +55,25 @@ class ProfileUIOutputTransformer
   ProfileUIOutput transform(ProfileEntity entity) {
     return ProfileUIOutput(
       types: entity.types,
-      description: entity.description,
+      description: entity.description.replaceAll(RegExp(r'[\n\f]'), ' '),
       height: entity.height / 10,
       weight: entity.weight / 10,
+      stats: entity.stats.map(
+        (s) {
+          return PokemonStat(
+            name: _kebabToTitleCase(s.name),
+            point: s.baseStat,
+          );
+        },
+      ).toList(growable: false),
     );
   }
+
+  String _kebabToTitleCase(String input) {
+    return input
+        .replaceAll('special', 'sp.')
+        .split('-')
+        .map((s) => s[0].toUpperCase() + s.substring(1))
+        .join(' ');
+  }
 }

packages/clean_framework/example/lib/features/profile/presentation/profile_presenter.dart

@@ -26,9 +26,10 @@ class ProfilePresenter
   ) {
     return ProfileViewModel(
       pokemonTypes: output.types.map(PokemonType.new).toList(growable: false),
-      description: output.description.replaceAll(RegExp(r'[\n\f]'), ' '),
+      description: output.description,
       height: '📏 ${output.height} m',
       weight: '⚖️ ${output.weight} kg',
+      stats: output.stats,
     );
   }
 }

packages/clean_framework/example/lib/features/profile/presentation/profile_ui.dart

@@ -1,4 +1,5 @@
 import 'package:clean_framework/clean_framework_core.dart';
+import 'package:clean_framework_example/features/profile/domain/profile_entity.dart';
 import 'package:clean_framework_example/features/profile/presentation/profile_presenter.dart';
 import 'package:clean_framework_example/features/profile/presentation/profile_view_model.dart';
 import 'package:clean_framework_example/widgets/spotlight.dart';
@@ -38,25 +39,29 @@ class ProfileUI extends UI<ProfileViewModel> {
               borderRadius: BorderRadius.circular(48),
             ),
             child: Padding(
-              padding: const EdgeInsets.fromLTRB(24, 88, 24, 16),
-              child: Column(
-                children: [
-                  Wrap(
-                    runSpacing: 8,
-                    spacing: 8,
-                    children: pokeTypes.map(_PokeTypeChip.new).toList(),
-                  ),
-                  const SizedBox(height: 16),
-                  Text(
-                    viewModel.description,
-                    style: Theme.of(context).textTheme.bodySmall,
-                  ),
-                  const SizedBox(height: 16),
-                  _BodyMeasurement(
-                    height: viewModel.height,
-                    weight: viewModel.weight,
-                  ),
-                ],
+              padding: const EdgeInsets.fromLTRB(24, 96, 24, 16),
+              child: SingleChildScrollView(
+                child: Column(
+                  children: [
+                    Wrap(
+                      runSpacing: 8,
+                      spacing: 8,
+                      children: pokeTypes.map(_PokeTypeChip.new).toList(),
+                    ),
+                    const SizedBox(height: 24),
+                    Text(
+                      viewModel.description,
+                      style: Theme.of(context).textTheme.bodySmall,
+                    ),
+                    const SizedBox(height: 24),
+                    _BodyMeasurement(
+                      height: viewModel.height,
+                      weight: viewModel.weight,
+                    ),
+                    const SizedBox(height: 32),
+                    _ProfileStats(stats: viewModel.stats),
+                  ],
+                ),
               ),
             ),
           );
@@ -66,6 +71,74 @@ class ProfileUI extends UI<ProfileViewModel> {
   }
 }
 
+class _ProfileStats extends StatelessWidget {
+  const _ProfileStats({required this.stats});
+
+  final List<PokemonStat> stats;
+
+  @override
+  Widget build(BuildContext context) {
+    return Column(
+      children: [
+        for (final stat in stats)
+          Padding(
+            padding: const EdgeInsets.all(6),
+            child: _StatRow(stat: stat),
+          ),
+      ],
+    );
+  }
+}
+
+class _StatRow extends StatelessWidget {
+  const _StatRow({required this.stat});
+
+  final PokemonStat stat;
+
+  @override
+  Widget build(BuildContext context) {
+    final themeData = Theme.of(context);
+    final primaryColor = themeData.colorScheme.primary;
+    final pointFraction = stat.point / 255;
+
+    return Row(
+      children: [
+        Expanded(
+          flex: 2,
+          child: Row(
+            children: [
+              Expanded(
+                child: Text(
+                  stat.name,
+                  style: themeData.textTheme.bodySmall,
+                ),
+              ),
+              const SizedBox(width: 16),
+              Text(
+                stat.point.toString(),
+                style: themeData.textTheme.titleSmall,
+              ),
+            ],
+          ),
+        ),
+        const SizedBox(width: 32),
+        Expanded(
+          flex: 3,
+          child: ClipRRect(
+            borderRadius: BorderRadius.circular(8),
+            child: LinearProgressIndicator(
+              color: primaryColor.withAlpha(stat.point),
+              value: pointFraction,
+              minHeight: 8,
+              backgroundColor: themeData.colorScheme.surfaceVariant,
+            ),
+          ),
+        ),
+      ],
+    );
+  }
+}
+
 class _BodyMeasurement extends StatelessWidget {
   const _BodyMeasurement({
     required this.height,

packages/clean_framework/example/lib/features/profile/presentation/profile_view_model.dart

@@ -1,4 +1,5 @@
 import 'package:clean_framework/clean_framework_core.dart';
+import 'package:clean_framework_example/features/profile/domain/profile_entity.dart';
 import 'package:flutter/material.dart';
 
 class ProfileViewModel extends ViewModel {
@@ -7,15 +8,17 @@ class ProfileViewModel extends ViewModel {
     required this.description,
     required this.height,
     required this.weight,
+    required this.stats,
   });
 
   final List<PokemonType> pokemonTypes;
   final String description;
   final String height;
   final String weight;
+  final List<PokemonStat> stats;
 
   @override
-  List<Object?> get props => [pokemonTypes, description, height, weight];
+  List<Object?> get props => [pokemonTypes, description, height, weight, stats];
 }
 
 class PokemonType {