@marcos_feitoza/personal-finance-frontend-core-ui 1.2.0 → 1.2.1

package/CHANGELOG.md

@@ -1,3 +1,10 @@
+## [1.2.1](https://github.com/MarcosOps/personal-finance-frontend-core-ui/compare/v1.2.0...v1.2.1) (2026-01-30)
+
+
+### Bug Fixes
+
+* Web responsivo (mobile/tablet/resize) ([dba28a4](https://github.com/MarcosOps/personal-finance-frontend-core-ui/commit/dba28a4c370aac6f02a0e304e25c6eebaca4b961))
+
 # [1.2.0](https://github.com/MarcosOps/personal-finance-frontend-core-ui/compare/v1.1.0...v1.2.0) (2026-01-29)
 
 

package/lib/personal_finance_frontend_core_ui.dart

@@ -3,3 +3,4 @@ export 'theme/app_theme.dart';
 export 'theme/app_colors.dart';
 export 'theme/app_spacing.dart';
 export 'utils/app_snackbars.dart';
+export 'utils/app_responsive.dart';

package/lib/utils/app_dialogs.dart

@@ -10,17 +10,17 @@ class AppDialogs {
       context: context,
       builder: (BuildContext context) {
         return AlertDialog(
-          title: const Text('Confirmar Exclusão'),
+          title: const Text('Confirm Deletion'),
           content: Text(
-              'Você tem certeza que deseja excluir "$itemName"? Esta ação não pode ser desfeita.'),
+              'Are you sure you want to delete "$itemName"? This action cannot be undone.'),
           actions: <Widget>[
             TextButton(
               onPressed: () => Navigator.of(context).pop(false),
-              child: const Text('Cancelar'),
+              child: const Text('Cancel'),
             ),
             TextButton(
               onPressed: () => Navigator.of(context).pop(true),
-              child: const Text('Excluir'),
+              child: const Text('Delete'),
             ),
           ],
         );

package/lib/utils/app_responsive.dart

@@ -0,0 +1,87 @@
+import 'package:flutter/widgets.dart';
+
+/// Simple responsive helpers and breakpoints.
+///
+/// Why this exists:
+/// - Most of the app was built desktop-first (many wide `Row`s and `DataTable`s).
+/// - On mobile/tablet or when resizing the browser, layouts overflow.
+/// - These helpers give us one place to define breakpoints and common patterns.
+///
+/// Breakpoints (can be adjusted later):
+/// - mobile: < 600
+/// - tablet: 600 .. < 1024
+/// - desktop: >= 1024
+class AppBreakpoints {
+  AppBreakpoints._();
+
+  static const double mobile = 600;
+  static const double tablet = 1024;
+
+  static bool isMobileWidth(double width) => width < mobile;
+  static bool isTabletWidth(double width) => width >= mobile && width < tablet;
+  static bool isDesktopWidth(double width) => width >= tablet;
+}
+
+/// Builds different widgets depending on the current available width.
+class ResponsiveBuilder extends StatelessWidget {
+  final Widget Function(BuildContext context) mobile;
+  final Widget Function(BuildContext context)? tablet;
+  final Widget Function(BuildContext context) desktop;
+
+  const ResponsiveBuilder({
+    super.key,
+    required this.mobile,
+    this.tablet,
+    required this.desktop,
+  });
+
+  @override
+  Widget build(BuildContext context) {
+    return LayoutBuilder(
+      builder: (context, constraints) {
+        final width = constraints.maxWidth;
+
+        if (AppBreakpoints.isMobileWidth(width)) {
+          return mobile(context);
+        }
+
+        if (AppBreakpoints.isTabletWidth(width)) {
+          return (tablet ?? desktop)(context);
+        }
+
+        return desktop(context);
+      },
+    );
+  }
+}
+
+/// Wraps a wide widget (like DataTable) with horizontal scroll when needed.
+///
+/// On desktop the widget is rendered normally.
+/// On mobile/tablet we enable horizontal scrolling to avoid overflow.
+class ResponsiveHorizontalScroll extends StatelessWidget {
+  final Widget child;
+
+  const ResponsiveHorizontalScroll({super.key, required this.child});
+
+  @override
+  Widget build(BuildContext context) {
+    return LayoutBuilder(
+      builder: (context, constraints) {
+        final width = constraints.maxWidth;
+        final needsScroll = !AppBreakpoints.isDesktopWidth(width);
+
+        if (!needsScroll) return child;
+
+        return SingleChildScrollView(
+          scrollDirection: Axis.horizontal,
+          child: ConstrainedBox(
+            // Make sure the child has at least the current width.
+            constraints: BoxConstraints(minWidth: width),
+            child: child,
+          ),
+        );
+      },
+    );
+  }
+}

package/lib/widgets/historical_data_table.dart

@@ -1,4 +1,5 @@
 import 'package:flutter/material.dart';
+import 'package:personal_finance_frontend_core_ui/utils/app_responsive.dart';
 
 /// A reusable widget to display historical data in a standardized DataTable.
 class HistoricalDataTable extends StatelessWidget {
@@ -24,8 +25,7 @@ class HistoricalDataTable extends StatelessWidget {
       );
     }
 
-    return SingleChildScrollView(
-      scrollDirection: Axis.horizontal,
+    return ResponsiveHorizontalScroll(
       child: DataTable(
         columnSpacing: 24.0,
         columns: columns,

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@marcos_feitoza/personal-finance-frontend-core-ui",
-    "version": "1.2.0",
+    "version": "1.2.1",
     "publishConfig": {
         "access": "public"
     },