UI-A2 — Adopt motion tokens across widgets (#171)

lib/features/connections/connections_panel.dart

@@ -8,6 +8,8 @@ import 'package:querya_desktop/core/database/redis_info.dart';
 import 'package:querya_desktop/core/storage/folders_storage.dart';
 import 'package:querya_desktop/core/storage/local_db.dart';
 import 'package:querya_desktop/core/theme/querya_typography.dart';
+import 'package:querya_desktop/core/motion/querya_motion.dart';
+import 'package:querya_desktop/core/motion/querya_motion_context.dart';
 import 'package:querya_desktop/features/connections/connection_creation_flow.dart';
 import 'package:querya_desktop/shared/widgets/widgets.dart';
 

lib/features/connections/connections_panel_mongo.dart

@@ -169,7 +169,8 @@ class _MongoConnectionTileState extends State<_MongoConnectionTile> {
                       padding: const material.EdgeInsets.all(2),
                       child: material.AnimatedRotation(
                         turns: _expanded ? 0.25 : 0,
-                        duration: const Duration(milliseconds: 100),
+                        duration: context.motionDuration(QueryaMotion.fast),
+                        curve: context.motionCurve(QueryaMotion.standardCurve),
                         child: material.Icon(
                           material.Icons.chevron_right_rounded,
                           size: 16,

lib/features/connections/connections_panel_mysql.dart

@@ -135,7 +135,8 @@ class _MysqlConnectionTileState extends State<_MysqlConnectionTile> {
                       padding: const material.EdgeInsets.all(2),
                       child: material.AnimatedRotation(
                         turns: _expanded ? 0.25 : 0,
-                        duration: const Duration(milliseconds: 100),
+                        duration: context.motionDuration(QueryaMotion.fast),
+                        curve: context.motionCurve(QueryaMotion.standardCurve),
                         child: material.Icon(
                           material.Icons.chevron_right_rounded,
                           size: 16,
@@ -387,7 +388,8 @@ class _MysqlDatabaseNodeState extends State<_MysqlDatabaseNode> {
             label: widget.databaseName,
             leading: material.AnimatedRotation(
               turns: _expanded ? 0.25 : 0,
-              duration: const Duration(milliseconds: 100),
+            duration: context.motionDuration(QueryaMotion.fast),
+            curve: context.motionCurve(QueryaMotion.standardCurve),
               child: material.Icon(
                 material.Icons.chevron_right_rounded,
                 size: 14,

lib/features/connections/connections_panel_pg_tree.dart

@@ -213,7 +213,8 @@ class _PgDatabasesNodeState extends State<_PgDatabasesNode> {
             label: 'Databases (${widget.databases.length})',
             leading: material.AnimatedRotation(
               turns: _expanded ? 0.25 : 0,
-              duration: const Duration(milliseconds: 100),
+              duration: context.motionDuration(QueryaMotion.fast),
+              curve: context.motionCurve(QueryaMotion.standardCurve),
               child: material.Icon(
                 material.Icons.chevron_right_rounded,
                 size: 14,
@@ -328,7 +329,8 @@ class _PgDatabaseNodeState extends State<_PgDatabaseNode> {
             label: widget.databaseName,
             leading: material.AnimatedRotation(
               turns: _expanded ? 0.25 : 0,
-              duration: const Duration(milliseconds: 100),
+              duration: context.motionDuration(QueryaMotion.fast),
+              curve: context.motionCurve(QueryaMotion.standardCurve),
               child: material.Icon(
                 material.Icons.chevron_right_rounded,
                 size: 14,
@@ -509,7 +511,8 @@ class _PgSchemasNodeState extends State<_PgSchemasNode> {
             label: 'Schemas (${widget.schemas.length})',
             leading: material.AnimatedRotation(
               turns: _expanded ? 0.25 : 0,
-              duration: const Duration(milliseconds: 100),
+              duration: context.motionDuration(QueryaMotion.fast),
+              curve: context.motionCurve(QueryaMotion.standardCurve),
               child: material.Icon(
                 material.Icons.chevron_right_rounded,
                 size: 14,
@@ -649,7 +652,8 @@ class _PgSchemaNodeState extends State<_PgSchemaNode> {
             label: widget.schemaName,
             leading: material.AnimatedRotation(
               turns: _expanded ? 0.25 : 0,
-              duration: const Duration(milliseconds: 100),
+              duration: context.motionDuration(QueryaMotion.fast),
+              curve: context.motionCurve(QueryaMotion.standardCurve),
               child: material.Icon(
                 material.Icons.chevron_right_rounded,
                 size: 14,
@@ -939,7 +943,8 @@ class _PgObjectGroupState extends State<_PgObjectGroup> {
             label: '${widget.label} (${widget.items.length})',
             leading: material.AnimatedRotation(
               turns: _expanded ? 0.25 : 0,
-              duration: const Duration(milliseconds: 100),
+              duration: context.motionDuration(QueryaMotion.fast),
+              curve: context.motionCurve(QueryaMotion.standardCurve),
               child: material.Icon(
                 material.Icons.chevron_right_rounded,
                 size: 13,

lib/features/connections/connections_panel_postgres_connection.dart

@@ -131,7 +131,8 @@ class _PostgresConnectionTileState extends State<_PostgresConnectionTile> {
                       padding: const material.EdgeInsets.all(2),
                       child: material.AnimatedRotation(
                         turns: _expanded ? 0.25 : 0,
-                        duration: const Duration(milliseconds: 100),
+                        duration: context.motionDuration(QueryaMotion.fast),
+                        curve: context.motionCurve(QueryaMotion.standardCurve),
                         child: material.Icon(
                           material.Icons.chevron_right_rounded,
                           size: 16,

lib/features/connections/connections_panel_redis.dart

@@ -148,7 +148,8 @@ class _RedisConnectionTileState extends State<_RedisConnectionTile> {
                       padding: const material.EdgeInsets.all(2),
                       child: material.AnimatedRotation(
                         turns: _expanded ? 0.25 : 0,
-                        duration: const Duration(milliseconds: 100),
+                        duration: context.motionDuration(QueryaMotion.fast),
+                        curve: context.motionCurve(QueryaMotion.standardCurve),
                         child: material.Icon(
                           material.Icons.chevron_right_rounded,
                           size: 16,

lib/features/connections/connections_panel_sidebar.dart

@@ -245,7 +245,8 @@ class _FolderTileState extends State<_FolderTile> {
                     children: [
                       material.AnimatedRotation(
                         turns: _expanded ? 0.25 : 0,
-                        duration: const Duration(milliseconds: 100),
+                        duration: context.motionDuration(QueryaMotion.fast),
+                        curve: context.motionCurve(QueryaMotion.standardCurve),
                         child: material.Icon(
                           material.Icons.chevron_right_rounded,
                           size: 18,

lib/features/connections/new_connection_dialog.dart

@@ -2,6 +2,8 @@ import 'dart:math' as math;
 
 import 'package:flutter/material.dart' as material;
 import 'package:querya_desktop/core/layout/window_layout.dart';
+import 'package:querya_desktop/core/motion/querya_motion.dart';
+import 'package:querya_desktop/core/motion/querya_motion_context.dart';
 import 'package:querya_desktop/shared/widgets/widgets.dart';
 
 /// Database type for new connection.
@@ -383,8 +385,8 @@ class _DbTypeCardState extends material.State<_DbTypeCard> {
       child: material.GestureDetector(
         onTap: widget.onTap,
         child: material.AnimatedContainer(
-          duration: const Duration(milliseconds: 120),
-          curve: material.Curves.easeOut,
+          duration: context.motionDuration(QueryaMotion.fast),
+          curve: context.motionCurve(QueryaMotion.enter),
           padding: const material.EdgeInsets.symmetric(vertical: 10, horizontal: 8),
           decoration: material.BoxDecoration(
             color: highlighted ? t.muted.withValues(alpha: 0.4) : t.muted.withValues(alpha: 0.12),

lib/features/main_screen/workspace_panel.dart

@@ -1,5 +1,7 @@
-import 'package:flutter/material.dart' as material show Alignment, Axis, Container, EdgeInsets, BoxDecoration, GestureDetector, Padding, BorderRadius, Center, Icon, Icons, MouseRegion, AnimatedContainer, AnimatedScale, Curves, SystemMouseCursors, SizedBox, SingleChildScrollView, Row, MainAxisSize;
+import 'package:flutter/material.dart' as material show Alignment, Axis, Container, EdgeInsets, BoxDecoration, GestureDetector, Padding, BorderRadius, Center, Icon, Icons, MouseRegion, AnimatedContainer, AnimatedScale, SystemMouseCursors, SizedBox, SingleChildScrollView, Row, MainAxisSize;
 import 'package:querya_desktop/core/layout/vertical_split_pane.dart';
+import 'package:querya_desktop/core/motion/querya_motion.dart';
+import 'package:querya_desktop/core/motion/querya_motion_context.dart';
 import 'package:querya_desktop/core/storage/local_db.dart';
 import 'package:querya_desktop/shared/widgets/widgets.dart';
 
@@ -341,8 +343,8 @@ class _TabButtonState extends State<_TabButton> {
         child: material.GestureDetector(
           onTap: widget.onTap,
           child: material.AnimatedContainer(
-            duration: const Duration(milliseconds: 120),
-            curve: material.Curves.easeOut,
+            duration: context.motionDuration(QueryaMotion.fast),
+            curve: context.motionCurve(QueryaMotion.enter),
             padding: const material.EdgeInsets.symmetric(horizontal: 12, vertical: 8),
             decoration: material.BoxDecoration(
               color: bgColor,
@@ -376,8 +378,8 @@ class _RunButtonState extends State<_RunButton> {
       cursor: material.SystemMouseCursors.click,
       child: material.AnimatedScale(
         scale: _hovered ? 1.03 : 1.0,
-        duration: const Duration(milliseconds: 100),
-        curve: material.Curves.easeOut,
+        duration: context.motionDuration(QueryaMotion.fast),
+        curve: context.motionCurve(QueryaMotion.enter),
         child: OutlineButton(
           onPressed: () {},
           leading: const material.Icon(material.Icons.play_arrow, size: 18),

lib/features/mysql/mysql_workspace_home.dart

@@ -1,6 +1,8 @@
 import 'dart:async' show unawaited;
 
 import 'package:flutter/material.dart' as material;
+import 'package:querya_desktop/core/motion/querya_motion.dart';
+import 'package:querya_desktop/core/motion/querya_motion_context.dart';
 import 'package:querya_desktop/core/storage/local_db.dart';
 import 'package:querya_desktop/features/mysql/mysql_sql_workspace.dart';
 import 'package:querya_desktop/features/mysql/mysql_stats_view.dart';
@@ -82,7 +84,8 @@ class _MysqlWorkspaceHomeState extends material.State<MysqlWorkspaceHome> {
                     child: material.GestureDetector(
                       onTap: () => unawaited(_selectTab(i)),
                       child: material.AnimatedContainer(
-                        duration: const Duration(milliseconds: 120),
+                        duration: context.motionDuration(QueryaMotion.fast),
+                        curve: context.motionCurve(QueryaMotion.enter),
                         padding: const material.EdgeInsets.symmetric(
                           horizontal: 12,
                           vertical: 8,

lib/features/postgresql/postgres_workspace_home.dart

@@ -1,6 +1,8 @@
 import 'dart:async' show unawaited;
 
 import 'package:flutter/material.dart' as material;
+import 'package:querya_desktop/core/motion/querya_motion.dart';
+import 'package:querya_desktop/core/motion/querya_motion_context.dart';
 import 'package:querya_desktop/core/storage/local_db.dart';
 import 'package:querya_desktop/features/postgresql/postgres_object_kind.dart';
 import 'package:querya_desktop/features/postgresql/postgres_sql_workspace.dart';
@@ -123,7 +125,8 @@ class _PostgresWorkspaceHomeState extends material.State<PostgresWorkspaceHome>
                     child: material.GestureDetector(
                       onTap: () => _selectTab(i),
                       child: material.AnimatedContainer(
-                        duration: const Duration(milliseconds: 120),
+                        duration: context.motionDuration(QueryaMotion.fast),
+                        curve: context.motionCurve(QueryaMotion.enter),
                         padding: const material.EdgeInsets.symmetric(
                           horizontal: 12,
                           vertical: 8,

lib/features/settings/theme_picker_button.dart

@@ -2,6 +2,8 @@ import 'dart:async';
 
 import 'package:flutter/material.dart' as material;
 import 'package:querya_desktop/core/layout/ui_scale.dart';
+import 'package:querya_desktop/core/motion/querya_motion.dart';
+import 'package:querya_desktop/core/motion/querya_motion_context.dart';
 import 'package:querya_desktop/core/theme/querya_theme.dart';
 import 'package:querya_desktop/core/theme/theme_definition.dart';
 import 'package:querya_desktop/features/settings/theme_preview_card.dart';
@@ -379,10 +381,8 @@ class _ThemePickerButtonState extends material.State<ThemePickerButton> {
       onEnter: _enabled ? (_) => setState(() => _triggerHovered = true) : null,
       onExit: _enabled ? (_) => setState(() => _triggerHovered = false) : null,
       child: material.AnimatedContainer(
-        duration: const Duration(
-          milliseconds: QueryaDropdownTokens.hoverAnimationMs,
-        ),
-        curve: material.Curves.easeOut,
+        duration: context.motionDuration(QueryaMotion.fast),
+        curve: context.motionCurve(QueryaMotion.enter),
         height: triggerHeight,
         padding: QueryaDropdownTokens.scaledTriggerPadding(context),
         decoration: material.BoxDecoration(
@@ -490,10 +490,8 @@ class _ThemePickerRowState extends material.State<_ThemePickerRow> {
           onTap: widget.onSelected,
           borderRadius: material.BorderRadius.circular(radius),
           child: material.AnimatedContainer(
-            duration: const Duration(
-              milliseconds: QueryaDropdownTokens.hoverAnimationMs,
-            ),
-            curve: material.Curves.easeOut,
+            duration: context.motionDuration(QueryaMotion.fast),
+            curve: context.motionCurve(QueryaMotion.enter),
             constraints: material.BoxConstraints(minHeight: itemHeight),
             padding: material.EdgeInsets.symmetric(
               horizontal:

lib/shared/widgets/app_dialog.dart

@@ -2,6 +2,9 @@ import 'dart:ui';
 
 import 'package:flutter/material.dart';
 
+import 'package:querya_desktop/core/motion/querya_motion.dart';
+import 'package:querya_desktop/core/motion/querya_motion_context.dart';
+
 /// Shows a modal dialog with a frosted, dimmed backdrop over the app.
 ///
 /// Use instead of [showDialog] so every overlay has consistent blur.
@@ -15,7 +18,7 @@ Future<T?> showAppDialog<T>({
     barrierDismissible: false,
     barrierLabel: MaterialLocalizations.of(context).modalBarrierDismissLabel,
     barrierColor: Colors.transparent,
-    transitionDuration: const Duration(milliseconds: 200),
+    transitionDuration: context.motionDuration(QueryaMotion.standard),
     pageBuilder: (ctx, animation, secondaryAnimation) {
       return _BlurredDialogScaffold(
         barrierDismissible: barrierDismissible,
@@ -44,12 +47,11 @@ class _BlurredDialogScaffold extends StatelessWidget {
   final Animation<double> animation;
   final Widget child;
 
-  // Eased curve for dialog card fade-in / scale-up.
-  static final _curve = CurveTween(curve: Curves.easeOutCubic);
-
   @override
   Widget build(BuildContext context) {
-    final curved = animation.drive(_curve);
+    final curved = animation.drive(
+      CurveTween(curve: context.motionCurve(QueryaMotion.enter)),
+    );
     return Material(
       type: MaterialType.transparency,
       child: Stack(

lib/shared/widgets/querya_dropdown.dart

@@ -1,6 +1,8 @@
 import 'package:flutter/foundation.dart';
 import 'package:flutter/material.dart' as material;
 import 'package:querya_desktop/core/layout/ui_scale.dart';
+import 'package:querya_desktop/core/motion/querya_motion.dart';
+import 'package:querya_desktop/core/motion/querya_motion_context.dart';
 import 'package:querya_desktop/shared/widgets/querya_dropdown_tokens.dart';
 import 'package:shadcn_flutter/shadcn_flutter.dart';
 
@@ -154,10 +156,8 @@ class _QueryaDropdownState<T> extends material.State<QueryaDropdown<T>> {
       onEnter: widget.enabled ? (_) => setState(() => _triggerHovered = true) : null,
       onExit: widget.enabled ? (_) => setState(() => _triggerHovered = false) : null,
       child: material.AnimatedContainer(
-        duration: const Duration(
-          milliseconds: QueryaDropdownTokens.hoverAnimationMs,
-        ),
-        curve: material.Curves.easeOut,
+        duration: context.motionDuration(QueryaMotion.fast),
+        curve: context.motionCurve(QueryaMotion.enter),
         height: triggerHeight,
         padding: QueryaDropdownTokens.scaledTriggerPadding(context),
         decoration: material.BoxDecoration(
@@ -350,10 +350,8 @@ class _QueryaDropdownMenuItemState<T> extends material.State<_QueryaDropdownMenu
         ),
         onPressed: widget.enabled ? widget.onPick : null,
         child: material.AnimatedContainer(
-          duration: const Duration(
-            milliseconds: QueryaDropdownTokens.hoverAnimationMs,
-          ),
-          curve: material.Curves.easeOut,
+          duration: context.motionDuration(QueryaMotion.fast),
+          curve: context.motionCurve(QueryaMotion.enter),
           constraints: material.BoxConstraints(minHeight: itemHeight),
           padding: material.EdgeInsets.symmetric(
             horizontal: context.scaled(QueryaDropdownTokens.menuItemPadding.horizontal),

lib/shared/widgets/querya_dropdown_tokens.dart

@@ -40,8 +40,6 @@ abstract final class QueryaDropdownTokens {
 
   static const double selectedCheckSlotWidth = 18.0;
 
-  static const int hoverAnimationMs = 120;
-
   static double scaledTriggerHeight(material.BuildContext context) =>
       context.scaled(triggerHeight);