✨ Adjust picker size

lib/screens/chat/room.dart

@@ -1141,8 +1141,15 @@ class _ChatInput extends HookConsumerWidget {
                       tooltip: 'stickers'.tr(),
                       icon: const Icon(Symbols.emoji_symbols),
                       onPressed: () {
+                        final size = MediaQuery.of(context).size;
                         showStickerPickerPopover(
                           context,
+                          Offset(
+                            20,
+                            size.height -
+                                480 -
+                                MediaQuery.of(context).padding.bottom,
+                          ),
                           onPick: (placeholder) {
                             // Insert placeholder at current cursor position
                             final text = messageController.text;

lib/widgets/stickers/picker.dart

@@ -1,3 +1,5 @@
+import 'dart:math' as math;
+
 import 'package:easy_localization/easy_localization.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter/services.dart';
@@ -9,6 +11,7 @@ import 'package:island/widgets/content/cloud_files.dart';
 import 'package:material_symbols_icons/symbols.dart';
 import 'package:riverpod_annotation/riverpod_annotation.dart';
 import 'package:styled_widget/styled_widget.dart';
+import 'package:flutter_popup_card/flutter_popup_card.dart';
 
 part 'picker.g.dart';
 
@@ -40,9 +43,9 @@ class StickerPicker extends HookConsumerWidget {
   Widget build(BuildContext context, WidgetRef ref) {
     final packsAsync = ref.watch(myStickerPacksProvider);
 
-    return Dialog(
+    return PopupCard(
-      insetPadding: const EdgeInsets.all(12),
+      elevation: 8,
-      clipBehavior: Clip.hardEdge,
+      shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(12.0)),
       child: ConstrainedBox(
         constraints: const BoxConstraints(maxWidth: 520, maxHeight: 520),
         child: packsAsync.when(
@@ -175,26 +178,28 @@ class _PackSwitcherState extends State<_PackSwitcher> {
           ],
         ).padding(horizontal: 12, top: 8, bottom: 4),
 
-        // Pack chips
+        // Vertical, scrollable packs rail like common emoji pickers
-        SingleChildScrollView(
+        SizedBox(
-          scrollDirection: Axis.horizontal,
+          height: 52,
-          padding: const EdgeInsets.symmetric(horizontal: 8),
+          child: ListView.separated(
-          child: Row(
+            padding: const EdgeInsets.symmetric(horizontal: 8),
-            children: [
+            scrollDirection: Axis.horizontal,
-              for (var i = 0; i < packs.length; i++)
+            itemCount: packs.length,
-                Padding(
+            separatorBuilder: (_, __) => const Gap(4),
-                  padding: const EdgeInsets.symmetric(horizontal: 4),
+            itemBuilder: (context, i) {
-                  child: ChoiceChip(
+              final selected = _index == i;
-                    label: Text(packs[i].name),
+              return Tooltip(
-                    selected: _index == i,
+                message: packs[i].name,
-                    onSelected: (v) {
+                child: FilterChip(
-                      if (!v) return;
+                  label: Text(packs[i].name, overflow: TextOverflow.ellipsis),
-                      setState(() => _index = i);
+                  selected: selected,
-                      HapticFeedback.selectionClick();
+                  onSelected: (_) {
-                    },
+                    setState(() => _index = i);
-                  ),
+                    HapticFeedback.selectionClick();
+                  },
                 ),
-            ],
+              );
+            },
           ),
         ),
         const Divider(height: 1),
@@ -269,21 +274,33 @@ class _StickersGrid extends StatelessWidget {
   }
 }
 
-/// Helper to show sticker picker as a popover dialog.
+/// Helper to show sticker picker as an anchored popover near the trigger.
-/// Usage:
+/// Provide the button's BuildContext (typically from the onPressed closure).
-/// await showStickerPickerPopover(context, onPick: (placeholder) { ... });
+/// Fallbacks to dialog if overlay cannot be found (e.g., during tests).
 Future<void> showStickerPickerPopover(
-  BuildContext context, {
+  BuildContext context,
+  Offset offset, {
   required void Function(String placeholder) onPick,
 }) async {
-  await showDialog(
+  // Use flutter_popup_card to present the anchored popup near trigger.
+  await showPopupCard<void>(
     context: context,
-    barrierDismissible: true,
+    offset: offset,
-    builder: (ctx) {
+    alignment: Alignment.topLeft,
-      return ProviderScope(
+    dimBackground: true,
-        parent: ProviderScope.containerOf(context),
+    builder:
-        child: StickerPicker(onPick: onPick),
+        (ctx) => SizedBox(
-      );
+          width: math.min(480, MediaQuery.of(context).size.width * 0.9),
-    },
+          height: 480,
+          child: ProviderScope(
+            parent: ProviderScope.containerOf(context),
+            child: StickerPicker(
+              onPick: (ph) {
+                onPick(ph);
+                Navigator.of(ctx).maybePop();
+              },
+            ),
+          ),
+        ),
   );
 }