first commit

unionflow-mobile-apps/lib/features/dashboard/presentation/widgets/kpi_card.dart

@@ -0,0 +1,116 @@
+import 'package:flutter/material.dart';
+import '../../../../shared/theme/app_theme.dart';
+
+class KPICard extends StatelessWidget {
+  final String title;
+  final String value;
+  final String change;
+  final IconData icon;
+  final Color color;
+  final bool isPositiveChange;
+
+  const KPICard({
+    super.key,
+    required this.title,
+    required this.value,
+    required this.change,
+    required this.icon,
+    required this.color,
+    this.isPositiveChange = true,
+  });
+
+  @override
+  Widget build(BuildContext context) {
+    return Container(
+      padding: const EdgeInsets.all(20),
+      decoration: BoxDecoration(
+        color: Colors.white,
+        borderRadius: BorderRadius.circular(16),
+        boxShadow: [
+          BoxShadow(
+            color: Colors.black.withOpacity(0.08),
+            blurRadius: 15,
+            offset: const Offset(0, 4),
+          ),
+        ],
+      ),
+      child: Column(
+        crossAxisAlignment: CrossAxisAlignment.start,
+        children: [
+          Row(
+            children: [
+              Container(
+                padding: const EdgeInsets.all(12),
+                decoration: BoxDecoration(
+                  color: color.withOpacity(0.15),
+                  borderRadius: BorderRadius.circular(12),
+                ),
+                child: Icon(
+                  icon,
+                  color: color,
+                  size: 24,
+                ),
+              ),
+              const Spacer(),
+              _buildChangeIndicator(),
+            ],
+          ),
+          const SizedBox(height: 20),
+          Text(
+            value,
+            style: const TextStyle(
+              fontSize: 28,
+              fontWeight: FontWeight.bold,
+              color: AppTheme.textPrimary,
+            ),
+          ),
+          const SizedBox(height: 8),
+          Text(
+            title,
+            style: const TextStyle(
+              fontSize: 16,
+              color: AppTheme.textSecondary,
+              fontWeight: FontWeight.w500,
+            ),
+          ),
+        ],
+      ),
+    );
+  }
+
+  Widget _buildChangeIndicator() {
+    final changeColor = isPositiveChange 
+        ? AppTheme.successColor 
+        : AppTheme.errorColor;
+    final changeIcon = isPositiveChange 
+        ? Icons.trending_up 
+        : Icons.trending_down;
+
+    return Container(
+      padding: const EdgeInsets.symmetric(horizontal: 10, vertical: 6),
+      decoration: BoxDecoration(
+        color: changeColor.withOpacity(0.1),
+        borderRadius: BorderRadius.circular(20),
+      ),
+      child: Row(
+        mainAxisSize: MainAxisSize.min,
+        children: [
+          Icon(
+            changeIcon,
+            size: 16,
+            color: changeColor,
+          ),
+          const SizedBox(width: 4),
+          Text(
+            change,
+            style: TextStyle(
+              color: changeColor,
+              fontSize: 14,
+              fontWeight: FontWeight.w600,
+            ),
+          ),
+        ],
+      ),
+    );
+  }
+}