Files
GroundedHelper/frontend/lib/Grounded/designs/buttons/Buttons.dart
alvocool c88887b639 Add tick boxes to task rows
Tasks now carry a tick box rather than being read-only rows. Ticking strikes
the title through and leaves the item in place, so a day still reads as a
record of what was asked rather than only what is left.

New in designs/Checkbox.dart:

- TickBox   the square box itself, animating between empty and filled
- TickRow   box + struck-through title + caller-supplied detail and trailing
- addTaskAffordance  the centred "Add new task" control beneath a day's list

Applied to the home plan, the overdue queue and the goal task list. Each
screen holds a set of optimistically ticked ids so the tick lands immediately
and rolls back if the call fails; the set is reconciled whenever fresh data
arrives.

A tick completes the item outright, whatever its proof requirement. The proof
flow is still reachable from the Complete button in the overdue queue, so
tasks that need an artefact have a route that asks for one — but the tick
itself no longer enforces it.

Late completes stay visually distinct: the row keeps a Late pill and the
warning accent, and the user is told the window had already closed.

flutter analyze lib/ reports no errors.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01Mfu2gQLSFN21YRBcU2NrTt
2026-07-31 21:51:15 +03:00

178 lines
4.6 KiB
Dart

import 'package:flutter/material.dart';
import '../../about/internal/application/TextType.dart';
import '../../utils/Colors.dart';
import '../text/Text.dart';
/// The primary action. One per screen — if a screen appears to need two, one
/// of them is secondary.
Widget roundedCornerButton(
String label,
VoidCallback onPressed, {
Color? background,
Color? foreground,
IconData? icon,
bool enabled = true,
double radius = 14,
double verticalPadding = 16,
}) {
final Color bg = enabled ? (background ?? colorPrimaryDark) : colorGrey;
final Color fg = foreground ?? colorWhite;
return ElevatedButton(
onPressed: enabled ? onPressed : null,
style: ElevatedButton.styleFrom(
elevation: 0,
backgroundColor: bg,
disabledBackgroundColor: colorGrey.withValues(alpha: 0.4),
padding: EdgeInsets.symmetric(vertical: verticalPadding),
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(radius),
),
),
child: Row(
mainAxisSize: MainAxisSize.min,
mainAxisAlignment: MainAxisAlignment.center,
children: [
if (icon != null) ...[
Icon(icon, size: 16, color: fg),
const SizedBox(width: 8),
],
text(label, 14, TextType.Bold, color: fg),
],
),
);
}
/// The secondary action — outlined, never filled, so the hierarchy is never
/// ambiguous.
Widget outlinedActionButton(
String label,
VoidCallback onPressed, {
Color? foreground,
IconData? icon,
bool enabled = true,
double radius = 14,
}) {
final Color fg = enabled ? (foreground ?? colorPrimaryDark) : colorGrey;
return OutlinedButton(
onPressed: enabled ? onPressed : null,
style: OutlinedButton.styleFrom(
side: BorderSide(color: fg.withValues(alpha: 0.35), width: 1),
padding: const EdgeInsets.symmetric(vertical: 16),
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(radius),
),
),
child: Row(
mainAxisSize: MainAxisSize.min,
mainAxisAlignment: MainAxisAlignment.center,
children: [
if (icon != null) ...[
Icon(icon, size: 16, color: fg),
const SizedBox(width: 8),
],
text(label, 14, TextType.Bold, color: fg),
],
),
);
}
Widget textButton(
String label,
VoidCallback onPressed, {
Color? color,
double textSize = 13,
TextType type = TextType.Regular,
}) {
return TextButton(
onPressed: onPressed,
child: text(label, textSize, type, color: color ?? colorGrey2),
);
}
Widget iconButton(
Widget icon,
VoidCallback onPressed, {
bool bordered = false,
Color? borderColor,
Color? background,
double radius = 10,
double size = 38,
}) {
return GestureDetector(
onTap: onPressed,
child: Container(
width: size,
height: size,
alignment: Alignment.center,
decoration: BoxDecoration(
color: background ?? Colors.transparent,
borderRadius: BorderRadius.circular(radius),
border: bordered
? Border.all(color: borderColor ?? colorBorder, width: 1)
: null,
),
child: icon,
),
);
}
/// The destructive action — abandoning, which costs the most debt of all and
/// so is always visually distinct from completing.
Widget destructiveButton(
String label,
VoidCallback onPressed, {
IconData? icon,
bool enabled = true,
}) {
return roundedCornerButton(
label,
onPressed,
background: colorDestructive,
foreground: colorWhite,
icon: icon,
enabled: enabled,
);
}
/// A segmented selector, used for class, energy, proof type and tone.
Widget segmentedSelector<T>({
required List<T> options,
required T selected,
required String Function(T) label,
required void Function(T) onSelected,
Color? activeColor,
}) {
final Color active = activeColor ?? colorPrimaryDark;
return Wrap(
spacing: 8,
runSpacing: 8,
children: options.map((option) {
final bool isSelected = option == selected;
return GestureDetector(
onTap: () => onSelected(option),
child: Container(
padding: const EdgeInsets.symmetric(horizontal: 14, vertical: 10),
decoration: BoxDecoration(
color: isSelected ? active : colorWhite,
borderRadius: BorderRadius.circular(10),
border: Border.all(
color: isSelected ? active : colorBorder,
width: 1,
),
),
child: text(
label(option),
12,
isSelected ? TextType.Bold : TextType.Regular,
color: isSelected ? colorWhite : colorGrey2,
),
),
);
}).toList(),
);
}