mirror of
https://github.com/block/buzz.git
synced 2026-10-31 14:31:02 +00:00
## Summary
- Refine the mobile composer with compact and expanded states, shared
footer fades, haptics, reliable keyboard dismissal, and full-width
camera and photo surfaces.
- Standardize popovers, filters, and section menus with consistent type,
strokes, radii, spacing, icons, and destructive styling.
- Align message presentation with desktop through consistent system
rows, typing and loading feedback, emoji placement, and predictable
photo viewing.
## Validation
- `just mobile-check`
- `just mobile-test` — 1,037 passed, 1 skipped
- Tested on Pixel 10 and a connected iPhone
## Snapshots
<table>
<tr>
<td align="center">Compact composer</td>
<td align="center">Attachment menu</td>
<td align="center">Recent photos</td>
</tr>
<tr>
<td><img
src="https://raw.githubusercontent.com/block/buzz/9732022cb13bb39ce797c4faaa714fe4c924955f/pr-3918--01-compact-composer.png"
width="260" /></td>
<td><img
src="https://raw.githubusercontent.com/block/buzz/9732022cb13bb39ce797c4faaa714fe4c924955f/pr-3918--02-attachment-menu.png"
width="260" /></td>
<td><img
src="https://raw.githubusercontent.com/block/buzz/9732022cb13bb39ce797c4faaa714fe4c924955f/pr-3918--03-photo-surface.png"
width="260" /></td>
</tr>
</table>
---------
Signed-off-by: kenny lopez <klopez4212@gmail.com>
91 lines
2.2 KiB
Dart
91 lines
2.2 KiB
Dart
part of '../compose_bar.dart';
|
|
|
|
class _FormattingToolbar extends StatelessWidget {
|
|
final void Function(String prefix, [String? suffix]) onFormat;
|
|
|
|
const _FormattingToolbar({required this.onFormat});
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
return Row(
|
|
key: const ValueKey('formatting-actions'),
|
|
mainAxisSize: MainAxisSize.min,
|
|
children: [
|
|
_FormatButton(
|
|
icon: LucideIcons.bold,
|
|
tooltip: 'Bold',
|
|
onTap: () => onFormat('**'),
|
|
),
|
|
_FormatButton(
|
|
icon: LucideIcons.italic,
|
|
tooltip: 'Italic',
|
|
onTap: () => onFormat('_'),
|
|
),
|
|
_FormatButton(
|
|
icon: LucideIcons.strikethrough,
|
|
tooltip: 'Strikethrough',
|
|
onTap: () => onFormat('~~'),
|
|
),
|
|
_FormatButton(
|
|
icon: LucideIcons.code,
|
|
tooltip: 'Code',
|
|
onTap: () => onFormat('`'),
|
|
),
|
|
_FormatButton(
|
|
icon: LucideIcons.squareCode,
|
|
tooltip: 'Code block',
|
|
onTap: () => onFormat('```\n', '\n```'),
|
|
),
|
|
],
|
|
);
|
|
}
|
|
}
|
|
|
|
class _FormatButton extends StatelessWidget {
|
|
final IconData icon;
|
|
final String tooltip;
|
|
final VoidCallback onTap;
|
|
|
|
const _FormatButton({
|
|
required this.icon,
|
|
required this.tooltip,
|
|
required this.onTap,
|
|
});
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
return Tooltip(
|
|
message: tooltip,
|
|
child: InkWell(
|
|
borderRadius: BorderRadius.circular(Radii.sm),
|
|
onTap: () => _runComposerAction(onTap),
|
|
child: Padding(
|
|
padding: const EdgeInsets.all(Grid.xxs),
|
|
child: Icon(icon, size: 18, color: context.colors.primary),
|
|
),
|
|
),
|
|
);
|
|
}
|
|
}
|
|
|
|
class _ComposeAction extends StatelessWidget {
|
|
final IconData icon;
|
|
final VoidCallback onTap;
|
|
|
|
const _ComposeAction({required this.icon, required this.onTap});
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
return SizedBox(
|
|
width: 36,
|
|
height: 36,
|
|
child: IconButton(
|
|
onPressed: () => _runComposerAction(onTap),
|
|
icon: Icon(icon, size: 20, color: context.colors.onSurfaceVariant),
|
|
padding: EdgeInsets.zero,
|
|
visualDensity: VisualDensity.compact,
|
|
),
|
|
);
|
|
}
|
|
}
|