kasy-cli 1.38.0 → 1.39.0

package/templates/firebase/lib/features/ai_chat/ui/widgets/ai_chat_conversation_view.dart

@@ -205,6 +205,12 @@ class _EmptyState extends StatelessWidget {
   }
 }
 
+/// How much of the available row width a single bubble may occupy. Caps long
+/// messages so they don't stretch edge-to-edge on wide layouts (desktop),
+/// keeping the left/right chat rhythm like WhatsApp. Short messages still hug
+/// their content via [Flexible].
+const double _kMaxBubbleWidthFraction = 0.75;
+
 class _ChatBubble extends StatelessWidget {
   const _ChatBubble({required this.message, required this.isUser});
 
@@ -223,50 +229,61 @@ class _ChatBubble extends StatelessWidget {
             ? context.colors.primary
             : context.colors.onBackground.withValues(alpha: 0.06),
         borderRadius: BorderRadius.only(
-          topLeft: const Radius.circular(16),
-          topRight: const Radius.circular(16),
+          topLeft: const Radius.circular(KasyRadius.lg),
+          topRight: const Radius.circular(KasyRadius.lg),
           bottomLeft: isUser
-              ? const Radius.circular(16)
-              : const Radius.circular(4),
+              ? const Radius.circular(KasyRadius.lg)
+              : const Radius.circular(KasyRadius.xs),
           bottomRight: isUser
-              ? const Radius.circular(4)
-              : const Radius.circular(16),
+              ? const Radius.circular(KasyRadius.xs)
+              : const Radius.circular(KasyRadius.lg),
         ),
       ),
       child: Text(
         message.content,
-        style: context.textTheme.bodyMedium?.copyWith(
+        style: context.textTheme.bodyLarge?.copyWith(
           color: isUser ? context.colors.onPrimary : context.colors.onBackground,
           height: 1.4,
         ),
       ),
     );
 
-    if (isUser) {
-      return Padding(
-        padding: const EdgeInsets.only(bottom: KasySpacing.sm),
-        child: Row(
-          mainAxisAlignment: MainAxisAlignment.end,
-          crossAxisAlignment: CrossAxisAlignment.end,
-          children: [
-            Flexible(child: bubble),
-            const SizedBox(width: KasySpacing.xs),
-            const AiChatUserAvatar(),
-          ],
-        ),
-      );
-    }
+    return LayoutBuilder(
+      builder: (context, constraints) {
+        final Widget cappedBubble = ConstrainedBox(
+          constraints: BoxConstraints(
+            maxWidth: constraints.maxWidth * _kMaxBubbleWidthFraction,
+          ),
+          child: bubble,
+        );
 
-    return Padding(
-      padding: const EdgeInsets.only(bottom: KasySpacing.sm),
-      child: Row(
-        crossAxisAlignment: CrossAxisAlignment.start,
-        children: [
-          const AiChatAssistantAvatar(),
-          const SizedBox(width: KasySpacing.xs),
-          Flexible(child: bubble),
-        ],
-      ),
+        if (isUser) {
+          return Padding(
+            padding: const EdgeInsets.only(bottom: KasySpacing.sm),
+            child: Row(
+              mainAxisAlignment: MainAxisAlignment.end,
+              crossAxisAlignment: CrossAxisAlignment.end,
+              children: [
+                Flexible(child: cappedBubble),
+                const SizedBox(width: KasySpacing.xs),
+                const AiChatUserAvatar(),
+              ],
+            ),
+          );
+        }
+
+        return Padding(
+          padding: const EdgeInsets.only(bottom: KasySpacing.sm),
+          child: Row(
+            crossAxisAlignment: CrossAxisAlignment.start,
+            children: [
+              const AiChatAssistantAvatar(),
+              const SizedBox(width: KasySpacing.xs),
+              Flexible(child: cappedBubble),
+            ],
+          ),
+        );
+      },
     );
   }
 }
@@ -327,10 +344,10 @@ class _TypingIndicatorState extends State<_TypingIndicator>
       decoration: BoxDecoration(
         color: context.colors.onBackground.withValues(alpha: 0.06),
         borderRadius: const BorderRadius.only(
-          topLeft: Radius.circular(16),
-          topRight: Radius.circular(16),
-          bottomLeft: Radius.circular(4),
-          bottomRight: Radius.circular(16),
+          topLeft: Radius.circular(KasyRadius.lg),
+          topRight: Radius.circular(KasyRadius.lg),
+          bottomLeft: Radius.circular(KasyRadius.xs),
+          bottomRight: Radius.circular(KasyRadius.lg),
         ),
       ),
       child: Row(

package/templates/firebase/lib/features/ai_chat/ui/widgets/ai_conversation_list.dart

@@ -126,7 +126,7 @@ class AiConversationList extends ConsumerWidget {
       padding: const EdgeInsets.symmetric(horizontal: KasySpacing.lg),
       decoration: BoxDecoration(
         color: context.colors.surfaceErrorSoft,
-        borderRadius: BorderRadius.circular(16),
+        borderRadius: BorderRadius.circular(KasyRadius.lg),
       ),
       child: Icon(KasyIcons.trash, color: context.colors.error),
     );

package/templates/firebase/lib/features/ai_chat/ui/widgets/ai_conversation_tile.dart

@@ -57,7 +57,7 @@ class _AiConversationTileState extends ConsumerState<AiConversationTile> {
         color: widget.selected
             ? context.colors.accentSoft
             : (_hovered ? context.colors.surfaceNeutralSoft : null),
-        borderRadius: BorderRadius.circular(16),
+        borderRadius: BorderRadius.circular(KasyRadius.lg),
       ),
       child: Row(
         crossAxisAlignment: CrossAxisAlignment.start,
@@ -75,7 +75,7 @@ class _AiConversationTileState extends ConsumerState<AiConversationTile> {
                         title,
                         maxLines: 1,
                         overflow: TextOverflow.ellipsis,
-                        style: context.kasyTextTheme.rowTitle.copyWith(
+                        style: context.kasyTextTheme.listRowTitle.copyWith(
                           color: titleColor,
                         ),
                       ),
@@ -89,7 +89,7 @@ class _AiConversationTileState extends ConsumerState<AiConversationTile> {
                   preview,
                   maxLines: 1,
                   overflow: TextOverflow.ellipsis,
-                  style: context.textTheme.bodySmall?.copyWith(
+                  style: context.textTheme.bodyMedium?.copyWith(
                     color: subtitleColor,
                   ),
                 ),
@@ -106,7 +106,7 @@ class _AiConversationTileState extends ConsumerState<AiConversationTile> {
       label: title,
       child: KasyFocusRing(
         onActivate: widget.onTap,
-        borderRadius: BorderRadius.circular(16),
+        borderRadius: BorderRadius.circular(KasyRadius.lg),
         child: GestureDetector(
           behavior: HitTestBehavior.opaque,
           onTap: widget.onTap,
@@ -129,10 +129,20 @@ class _AiConversationTileState extends ConsumerState<AiConversationTile> {
     if (kIsWeb && _hovered) {
       return SizedBox(
         height: 16,
-        child: InkResponse(
-          onTap: widget.onDelete,
-          radius: 18,
-          child: Icon(KasyIcons.trash, size: KasyIconSize.sm, color: context.colors.error),
+        // Plain pointer-cursor tap (no Material ripple), consistent with the
+        // rest of the kit's web controls. The icon only appears while the row
+        // is hovered, so it's already a pointer-only affordance.
+        child: MouseRegion(
+          cursor: SystemMouseCursors.click,
+          child: GestureDetector(
+            behavior: HitTestBehavior.opaque,
+            onTap: widget.onDelete,
+            child: Icon(
+              KasyIcons.trash,
+              size: KasyIconSize.sm,
+              color: context.colors.error,
+            ),
+          ),
         ),
       );
     }

package/templates/firebase/lib/features/authentication/ui/signin_page.dart

@@ -8,10 +8,8 @@ import 'package:kasy_kit/components/components.dart';
 import 'package:kasy_kit/core/bottom_menu/web_url.dart';
 import 'package:kasy_kit/core/config/features.dart';
 import 'package:kasy_kit/core/data/models/user.dart';
-import 'package:kasy_kit/core/haptics/kasy_haptics.dart';
 import 'package:kasy_kit/core/states/user_state_notifier.dart';
 import 'package:kasy_kit/core/theme/theme.dart';
-import 'package:kasy_kit/core/widgets/kasy_focus_ring.dart';
 import 'package:kasy_kit/core/widgets/kasy_pressable_depth.dart';
 import 'package:kasy_kit/environments.dart';
 import 'package:kasy_kit/features/authentication/providers/models/email.dart';
@@ -20,6 +18,7 @@ import 'package:kasy_kit/features/authentication/providers/models/signin_state.d
 import 'package:kasy_kit/features/authentication/providers/signin_state_provider.dart';
 import 'package:kasy_kit/features/authentication/ui/widgets/auth_card_scaffold.dart';
 import 'package:kasy_kit/features/authentication/ui/widgets/auth_page_back_button.dart';
+import 'package:kasy_kit/features/authentication/ui/widgets/social_auth_tile.dart';
 import 'package:kasy_kit/features/authentication/ui/widgets/social_separator.dart';
 import 'package:kasy_kit/i18n/translations.g.dart';
 
@@ -323,9 +322,9 @@ class _SocialSigninRow extends ConsumerWidget {
     return Row(
       children: [
         Expanded(
-          child: _SocialSigninTile(
+          child: SocialAuthButton(
             label: t.auth.signin.google,
-            icon: Image.asset('assets/icons/google.png', width: 20, height: 20),
+            iconAsset: 'assets/icons/google.svg',
             onPressed: isSending
                 ? null
                 : () =>
@@ -335,9 +334,13 @@ class _SocialSigninRow extends ConsumerWidget {
         if (showApple) ...[
           const SizedBox(width: KasySpacing.sm),
           Expanded(
-            child: _SocialSigninTile(
+            child: SocialAuthButton(
               label: t.auth.signin.apple,
-              icon: Image.asset('assets/icons/apple.png', width: 20, height: 20),
+              // Apple's mark is officially black-on-light / white-on-dark, so
+              // pick the variant that stays visible on the current theme.
+              iconAsset: context.isDark
+                  ? 'assets/icons/apple_white.svg'
+                  : 'assets/icons/apple_black.svg',
               onPressed: isSending
                   ? null
                   : () => ref
@@ -349,13 +352,9 @@ class _SocialSigninRow extends ConsumerWidget {
         if (showFacebook) ...[
           const SizedBox(width: KasySpacing.sm),
           Expanded(
-            child: _SocialSigninTile(
+            child: SocialAuthButton(
               label: t.auth.signin.facebook,
-              icon: Image.asset(
-                'assets/icons/facebook.png',
-                width: 20,
-                height: 20,
-              ),
+              iconAsset: 'assets/icons/facebook.svg',
               onPressed: isSending
                   ? null
                   : () => ref
@@ -369,52 +368,3 @@ class _SocialSigninRow extends ConsumerWidget {
   }
 }
 
-class _SocialSigninTile extends StatelessWidget {
-  const _SocialSigninTile({
-    required this.label,
-    required this.icon,
-    required this.onPressed,
-  });
-
-  final String label;
-  final Widget icon;
-  final VoidCallback? onPressed;
-
-  @override
-  Widget build(BuildContext context) {
-    final bool enabled = onPressed != null;
-    void handleTap() {
-      KasyHaptics.medium(context);
-      onPressed?.call();
-    }
-    return KasyFocusRing(
-      enabled: enabled,
-      onActivate: handleTap,
-      borderRadius: BorderRadius.circular(KasyRadius.sm),
-      child: Material(
-        color: Colors.transparent,
-        child: InkWell(
-          // Focus + keyboard activation live in KasyFocusRing; the InkWell keeps
-          // its tap ripple but doesn't take focus, so the ring is the only Tab
-          // stop and matches every other button's focus outline.
-          canRequestFocus: false,
-          onTap: enabled ? handleTap : null,
-          borderRadius: BorderRadius.circular(KasyRadius.md),
-          child: Ink(
-            height: 44,
-            decoration: BoxDecoration(
-              color: context.colors.surface,
-              borderRadius: BorderRadius.circular(KasyRadius.sm),
-              border: Border.all(
-                color: context.colors.outline.withValues(alpha: 0.38),
-              ),
-            ),
-            child: Center(
-              child: Semantics(button: true, label: label, child: icon),
-            ),
-          ),
-        ),
-      ),
-    );
-  }
-}

package/templates/firebase/lib/features/authentication/ui/signup_page.dart

@@ -7,10 +7,8 @@ import 'package:go_router/go_router.dart';
 import 'package:kasy_kit/components/components.dart';
 import 'package:kasy_kit/core/config/features.dart';
 import 'package:kasy_kit/core/data/models/user.dart';
-import 'package:kasy_kit/core/haptics/kasy_haptics.dart';
 import 'package:kasy_kit/core/states/user_state_notifier.dart';
 import 'package:kasy_kit/core/theme/theme.dart';
-import 'package:kasy_kit/core/widgets/kasy_focus_ring.dart';
 import 'package:kasy_kit/core/widgets/kasy_pressable_depth.dart';
 import 'package:kasy_kit/features/authentication/providers/models/email.dart';
 import 'package:kasy_kit/features/authentication/providers/models/password.dart';
@@ -20,6 +18,7 @@ import 'package:kasy_kit/features/authentication/providers/signin_state_provider
 import 'package:kasy_kit/features/authentication/providers/signup_state_provider.dart';
 import 'package:kasy_kit/features/authentication/ui/widgets/auth_card_scaffold.dart';
 import 'package:kasy_kit/features/authentication/ui/widgets/auth_page_back_button.dart';
+import 'package:kasy_kit/features/authentication/ui/widgets/social_auth_tile.dart';
 import 'package:kasy_kit/features/authentication/ui/widgets/social_separator.dart';
 import 'package:kasy_kit/i18n/translations.g.dart';
 
@@ -223,9 +222,9 @@ class _SocialSignupRow extends ConsumerWidget {
     return Row(
       children: [
         Expanded(
-          child: _SocialSignupTile(
+          child: SocialAuthButton(
             label: t.auth.signin.google,
-            icon: Image.asset('assets/icons/google.png', width: 20, height: 20),
+            iconAsset: 'assets/icons/google.svg',
             onPressed: isSending
                 ? null
                 : () =>
@@ -235,9 +234,13 @@ class _SocialSignupRow extends ConsumerWidget {
         if (showApple) ...[
           const SizedBox(width: KasySpacing.sm),
           Expanded(
-            child: _SocialSignupTile(
+            child: SocialAuthButton(
               label: t.auth.signin.apple,
-              icon: Image.asset('assets/icons/apple.png', width: 20, height: 20),
+              // Apple's mark is officially black-on-light / white-on-dark, so
+              // pick the variant that stays visible on the current theme.
+              iconAsset: context.isDark
+                  ? 'assets/icons/apple_white.svg'
+                  : 'assets/icons/apple_black.svg',
               onPressed: isSending
                   ? null
                   : () => ref
@@ -249,13 +252,9 @@ class _SocialSignupRow extends ConsumerWidget {
         if (showFacebook) ...[
           const SizedBox(width: KasySpacing.sm),
           Expanded(
-            child: _SocialSignupTile(
+            child: SocialAuthButton(
               label: t.auth.signin.facebook,
-              icon: Image.asset(
-                'assets/icons/facebook.png',
-                width: 20,
-                height: 20,
-              ),
+              iconAsset: 'assets/icons/facebook.svg',
               onPressed: isSending
                   ? null
                   : () => ref
@@ -269,52 +268,3 @@ class _SocialSignupRow extends ConsumerWidget {
   }
 }
 
-class _SocialSignupTile extends StatelessWidget {
-  const _SocialSignupTile({
-    required this.label,
-    required this.icon,
-    required this.onPressed,
-  });
-
-  final String label;
-  final Widget icon;
-  final VoidCallback? onPressed;
-
-  @override
-  Widget build(BuildContext context) {
-    final bool enabled = onPressed != null;
-    void handleTap() {
-      KasyHaptics.medium(context);
-      onPressed?.call();
-    }
-    return KasyFocusRing(
-      enabled: enabled,
-      onActivate: handleTap,
-      borderRadius: BorderRadius.circular(KasyRadius.sm),
-      child: Material(
-        color: Colors.transparent,
-        child: InkWell(
-          // Focus + keyboard activation live in KasyFocusRing; the InkWell keeps
-          // its tap ripple but doesn't take focus, so the ring is the only Tab
-          // stop and matches every other button's focus outline.
-          canRequestFocus: false,
-          onTap: enabled ? handleTap : null,
-          borderRadius: BorderRadius.circular(KasyRadius.md),
-          child: Ink(
-            height: 44,
-            decoration: BoxDecoration(
-              color: context.colors.surface,
-              borderRadius: BorderRadius.circular(KasyRadius.sm),
-              border: Border.all(
-                color: context.colors.outline.withValues(alpha: 0.38),
-              ),
-            ),
-            child: Center(
-              child: Semantics(button: true, label: label, child: icon),
-            ),
-          ),
-        ),
-      ),
-    );
-  }
-}

package/templates/firebase/lib/features/authentication/ui/widgets/auth_card_scaffold.dart

@@ -25,7 +25,7 @@ class AuthCardScaffold extends StatelessWidget {
     required this.subtitle,
     required this.children,
     this.showLogo = true,
-    this.logoHeight = 96,
+    this.logoHeight = 132,
     this.maxContentWidth = 420,
   });
 
@@ -74,7 +74,7 @@ class AuthCardScaffold extends StatelessWidget {
                         curve: Curves.easeOut,
                       ),
                 ),
-                const SizedBox(height: KasySpacing.lg),
+                const SizedBox(height: KasySpacing.sm),
               ],
               Text(
                 title,
@@ -111,9 +111,11 @@ class AuthCardScaffold extends StatelessWidget {
                   child: isMobile
                       ? content
                       : KasyCard(
-                          padding: const EdgeInsets.symmetric(
-                            horizontal: KasySpacing.lg,
-                            vertical: KasySpacing.xl,
+                          padding: const EdgeInsets.fromLTRB(
+                            KasySpacing.lg,
+                            KasySpacing.md,
+                            KasySpacing.lg,
+                            KasySpacing.xl,
                           ),
                           child: content,
                         ),

package/templates/firebase/lib/features/authentication/ui/widgets/social_auth_tile.dart

@@ -0,0 +1,83 @@
+import 'package:flutter/material.dart';
+import 'package:flutter_svg/flutter_svg.dart';
+import 'package:kasy_kit/core/haptics/kasy_haptics.dart';
+import 'package:kasy_kit/core/theme/theme.dart';
+import 'package:kasy_kit/core/widgets/kasy_hover.dart';
+
+/// Outlined social sign-in button (Google / Apple / Facebook), shared by the
+/// sign-in and sign-up screens.
+///
+/// Each tile fills its slot in the social row (the parent wraps it in an
+/// [Expanded]) and centers the provider glyph. It uses [KasyHover] so it has a
+/// real hover highlight on web/desktop and a press fill on every platform — no
+/// Material ripple, matching the rest of the kit's interactive controls. While a
+/// request is in flight ([onPressed] null) it dims and stops responding to
+/// pointer and keyboard.
+class SocialAuthButton extends StatelessWidget {
+  const SocialAuthButton({
+    super.key,
+    required this.label,
+    required this.iconAsset,
+    required this.onPressed,
+  });
+
+  /// Accessibility label (the provider name) announced to screen readers.
+  final String label;
+
+  /// Path to the provider's official brand SVG bundled under `assets/icons/`
+  /// (e.g. `assets/icons/google.svg`). Rendered at full brand colour and at a
+  /// shared [KasyIconSize.lg] box so every provider stays the same size. For
+  /// Apple, the caller picks the black/white variant for the current theme.
+  final String iconAsset;
+
+  /// Tap handler. When null the button is disabled (dimmed, inert).
+  final VoidCallback? onPressed;
+
+  @override
+  Widget build(BuildContext context) {
+    final bool enabled = onPressed != null;
+    final BorderRadius radius = BorderRadius.circular(KasyRadius.sm);
+
+    // No background fill: the KasyHover overlay sits behind the transparent
+    // interior to provide the hover/press tint, and on the surface auth card a
+    // fill would be invisible anyway. The hairline border gives the outlined
+    // shape, consistent with KasyButton's outlined variant.
+    final Widget surface = Container(
+      height: 44,
+      decoration: BoxDecoration(
+        borderRadius: radius,
+        border: Border.all(
+          color: context.colors.outline.withValues(alpha: 0.38),
+        ),
+      ),
+      child: Center(
+        // Brand logos have different aspect ratios (Apple is tall, Google is
+        // square); SvgPicture defaults to BoxFit.contain, which keeps each one
+        // inside the shared box without distortion so the row stays balanced.
+        child: SvgPicture.asset(
+          iconAsset,
+          width: KasyIconSize.lg,
+          height: KasyIconSize.lg,
+        ),
+      ),
+    );
+
+    if (!enabled) {
+      return Opacity(opacity: 0.5, child: surface);
+    }
+
+    return KasyHover(
+      onTap: () {
+        KasyHaptics.medium(context);
+        onPressed!();
+      },
+      // KasyHover fires a light selection haptic by default; a social sign-in is
+      // a significant action, so opt out and fire the heavier "medium" above.
+      hapticEnabled: false,
+      focusable: true,
+      borderRadius: radius,
+      semanticLabel: label,
+      child: surface,
+    );
+  }
+}

package/templates/firebase/lib/features/feedbacks/ui/widgets/feature_card.dart

@@ -59,15 +59,15 @@ class _FeatureCardState extends State<FeatureCard> {
               children: [
                 Text(
                   widget.title,
-                  style: context.textTheme.titleMedium?.copyWith(
-                    fontWeight: FontWeight.w700,
+                  style: context.kasyTextTheme.listRowTitle.copyWith(
+                    color: context.colors.onSurface,
+                    fontWeight: FontWeight.w600,
                   ),
                 ),
                 const SizedBox(height: 2),
                 Text(
                   widget.description,
-                  style: context.textTheme.bodySmall?.copyWith(
-                    fontWeight: FontWeight.w400,
+                  style: context.textTheme.bodyMedium?.copyWith(
                     color: context.colors.muted,
                   ),
                 ),