full app done
This commit is contained in:
davmar
@@ -1,142 +0,0 @@
|
||||
/// Validated form that inserts a new [Item] into [ItemController].
|
||||
library;
|
||||
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:provider/provider.dart';
|
||||
|
||||
import '../models/item.dart';
|
||||
import '../providers/item_provider.dart';
|
||||
import '../widgets/app_text_field.dart';
|
||||
import '../widgets/responsive_body.dart';
|
||||
|
||||
class AddItemScreen extends StatefulWidget {
|
||||
const AddItemScreen({super.key});
|
||||
|
||||
@override
|
||||
State<AddItemScreen> createState() => _AddItemScreenState();
|
||||
}
|
||||
|
||||
class _AddItemScreenState extends State<AddItemScreen> {
|
||||
final _formKey = GlobalKey<FormState>();
|
||||
final _title = TextEditingController();
|
||||
final _subtitle = TextEditingController();
|
||||
final _description = TextEditingController();
|
||||
ItemCategory? _category;
|
||||
bool _submitted = false;
|
||||
|
||||
@override
|
||||
void dispose() {
|
||||
_title.dispose();
|
||||
_subtitle.dispose();
|
||||
_description.dispose();
|
||||
super.dispose();
|
||||
}
|
||||
|
||||
String? _requiredLength(String? value, {required int min, String? label}) {
|
||||
final text = value?.trim() ?? '';
|
||||
if (text.isEmpty) return 'Enter a ${label ?? 'value'}.';
|
||||
if (text.length < min) {
|
||||
return '${label ?? 'This field'} must be at least $min characters.';
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
void _submit() {
|
||||
setState(() => _submitted = true);
|
||||
final form = _formKey.currentState;
|
||||
if (form == null || !form.validate() || _category == null) return;
|
||||
|
||||
context.read<ItemController>().addItem(
|
||||
title: _title.text,
|
||||
subtitle: _subtitle.text,
|
||||
description: _description.text,
|
||||
category: _category!,
|
||||
);
|
||||
|
||||
ScaffoldMessenger.of(context).showSnackBar(
|
||||
SnackBar(content: Text('Added “${_title.text.trim()}”')),
|
||||
);
|
||||
Navigator.of(context).pop();
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final theme = Theme.of(context);
|
||||
|
||||
return Scaffold(
|
||||
appBar: AppBar(title: const Text('Add item')),
|
||||
body: ResponsiveBody(
|
||||
child: Form(
|
||||
key: _formKey,
|
||||
autovalidateMode: _submitted
|
||||
? AutovalidateMode.onUserInteraction
|
||||
: AutovalidateMode.disabled,
|
||||
child: ListView(
|
||||
children: [
|
||||
const SizedBox(height: 8),
|
||||
Text(
|
||||
'Create a catalog entry. All fields are required.',
|
||||
style: theme.textTheme.bodyMedium,
|
||||
),
|
||||
const SizedBox(height: 20),
|
||||
AppTextField(
|
||||
controller: _title,
|
||||
label: 'Title',
|
||||
hint: 'Give it a short name',
|
||||
autofocus: true,
|
||||
textInputAction: TextInputAction.next,
|
||||
validator: (value) =>
|
||||
_requiredLength(value, min: 3, label: 'Title'),
|
||||
),
|
||||
const SizedBox(height: 16),
|
||||
AppTextField(
|
||||
controller: _subtitle,
|
||||
label: 'Summary',
|
||||
hint: 'One sentence overview',
|
||||
textInputAction: TextInputAction.next,
|
||||
validator: (value) =>
|
||||
_requiredLength(value, min: 8, label: 'Summary'),
|
||||
),
|
||||
const SizedBox(height: 16),
|
||||
DropdownButtonFormField<ItemCategory>(
|
||||
initialValue: _category,
|
||||
decoration: const InputDecoration(labelText: 'Category'),
|
||||
items: [
|
||||
for (final category in ItemCategory.values)
|
||||
DropdownMenuItem(
|
||||
value: category,
|
||||
child: Text(category.label),
|
||||
),
|
||||
],
|
||||
onChanged: (value) => setState(() => _category = value),
|
||||
validator: (value) =>
|
||||
value == null ? 'Choose a category.' : null,
|
||||
),
|
||||
const SizedBox(height: 16),
|
||||
AppTextField(
|
||||
controller: _description,
|
||||
label: 'Description',
|
||||
hint: 'A longer note the detail screen will show',
|
||||
maxLines: 5,
|
||||
keyboardType: TextInputType.multiline,
|
||||
validator: (value) =>
|
||||
_requiredLength(value, min: 16, label: 'Description'),
|
||||
),
|
||||
const SizedBox(height: 24),
|
||||
FilledButton(
|
||||
onPressed: _submit,
|
||||
child: const Text('Save item'),
|
||||
),
|
||||
const SizedBox(height: 12),
|
||||
OutlinedButton(
|
||||
onPressed: () => Navigator.of(context).pop(),
|
||||
child: const Text('Cancel'),
|
||||
),
|
||||
const SizedBox(height: 24),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,190 @@
|
||||
/// Stage 1 — assign each value card into one of five reflective piles.
|
||||
library;
|
||||
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:provider/provider.dart';
|
||||
|
||||
import '../models/value_pile.dart';
|
||||
import '../providers/values_sort_provider.dart';
|
||||
import '../widgets/practice_chrome.dart';
|
||||
import '../widgets/value_card_tile.dart';
|
||||
|
||||
class CardSortingScreen extends StatelessWidget {
|
||||
const CardSortingScreen({super.key});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final sort = context.watch<ValuesSortController>();
|
||||
final text = Theme.of(context).textTheme;
|
||||
final colors = Theme.of(context).colorScheme;
|
||||
final card = sort.currentCard;
|
||||
|
||||
return PracticeScaffold(
|
||||
padding: const EdgeInsets.fromLTRB(20, 4, 20, 8),
|
||||
header: Padding(
|
||||
padding: const EdgeInsets.fromLTRB(12, 4, 12, 0),
|
||||
child: Row(
|
||||
children: [
|
||||
TextButton.icon(
|
||||
onPressed: sort.sortedCount == 0 ? null : sort.undoLastSort,
|
||||
icon: const Icon(Icons.undo, size: 18),
|
||||
label: const Text('Undo'),
|
||||
),
|
||||
const Spacer(),
|
||||
Text(
|
||||
'Stage 1 · Initial Sort',
|
||||
style: text.labelMedium,
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
child: Column(
|
||||
children: [
|
||||
Row(
|
||||
children: [
|
||||
Icon(Icons.bookmark_border, size: 18, color: colors.onSurfaceVariant),
|
||||
const SizedBox(width: 6),
|
||||
Expanded(
|
||||
child: Text(
|
||||
'${sort.sortedCount} of ${sort.totalCount} values sorted',
|
||||
style: text.labelMedium,
|
||||
),
|
||||
),
|
||||
Text(
|
||||
'${(sort.sortProgress * 100).round()}%',
|
||||
style: text.labelMedium?.copyWith(
|
||||
color: colors.primary,
|
||||
fontWeight: FontWeight.w700,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
const SizedBox(height: 8),
|
||||
ClipRRect(
|
||||
borderRadius: BorderRadius.circular(999),
|
||||
child: LinearProgressIndicator(
|
||||
value: sort.sortProgress,
|
||||
minHeight: 6,
|
||||
backgroundColor: colors.surfaceContainerHigh,
|
||||
color: colors.secondary,
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 12),
|
||||
Expanded(
|
||||
child: AnimatedSwitcher(
|
||||
duration: const Duration(milliseconds: 280),
|
||||
child: card == null
|
||||
? Center(
|
||||
key: const ValueKey('empty'),
|
||||
child: Text('All sorted', style: text.headlineMedium),
|
||||
)
|
||||
: SingleChildScrollView(
|
||||
key: ValueKey(card.id),
|
||||
child: Column(
|
||||
children: [
|
||||
ValueCardTile(card: card, elevation: 2),
|
||||
const SizedBox(height: 14),
|
||||
Text(
|
||||
'Tap a pile to sort',
|
||||
style: text.labelMedium?.copyWith(
|
||||
color: colors.onSurfaceVariant,
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 8),
|
||||
...ValuePile.values.map((pile) {
|
||||
return Padding(
|
||||
padding: const EdgeInsets.only(bottom: 8),
|
||||
child: _PileButton(
|
||||
pile: pile,
|
||||
count: sort.countInPile(pile),
|
||||
onTap: () => sort.assignCurrent(pile),
|
||||
),
|
||||
);
|
||||
}),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class _PileButton extends StatelessWidget {
|
||||
const _PileButton({
|
||||
required this.pile,
|
||||
required this.count,
|
||||
required this.onTap,
|
||||
});
|
||||
|
||||
final ValuePile pile;
|
||||
final int count;
|
||||
final VoidCallback? onTap;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final text = Theme.of(context).textTheme;
|
||||
final colors = Theme.of(context).colorScheme;
|
||||
|
||||
return Material(
|
||||
color: colors.surfaceContainerLow,
|
||||
shape: RoundedRectangleBorder(
|
||||
borderRadius: BorderRadius.circular(18),
|
||||
side: BorderSide(color: pile.accent.withValues(alpha: 0.35)),
|
||||
),
|
||||
child: InkWell(
|
||||
onTap: onTap,
|
||||
borderRadius: BorderRadius.circular(18),
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 14, vertical: 12),
|
||||
child: Row(
|
||||
children: [
|
||||
Container(
|
||||
width: 28,
|
||||
height: 28,
|
||||
alignment: Alignment.center,
|
||||
decoration: BoxDecoration(
|
||||
color: pile.accent.withValues(alpha: 0.15),
|
||||
shape: BoxShape.circle,
|
||||
),
|
||||
child: Text(
|
||||
'${pile.rank}',
|
||||
style: text.labelMedium?.copyWith(
|
||||
color: pile.accent,
|
||||
fontWeight: FontWeight.w700,
|
||||
),
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 12),
|
||||
Expanded(
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(
|
||||
pile.label,
|
||||
style: text.titleMedium?.copyWith(
|
||||
color: colors.onSurface,
|
||||
),
|
||||
),
|
||||
Text(
|
||||
pile.subtitle,
|
||||
style: text.bodySmall?.copyWith(
|
||||
color: colors.onSurfaceVariant,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
Text(
|
||||
'$count',
|
||||
style: text.labelMedium?.copyWith(color: pile.accent),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -1,212 +0,0 @@
|
||||
/// Home tab: greeting, stats, and a [ListView.builder] of catalog items.
|
||||
library;
|
||||
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:provider/provider.dart';
|
||||
|
||||
import '../providers/item_provider.dart';
|
||||
import '../widgets/empty_state.dart';
|
||||
import '../widgets/item_card.dart';
|
||||
import '../widgets/loading_view.dart';
|
||||
import '../widgets/responsive_body.dart';
|
||||
import 'add_item_screen.dart';
|
||||
|
||||
class HomeScreen extends StatelessWidget {
|
||||
const HomeScreen({super.key});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final controller = context.watch<ItemController>();
|
||||
final theme = Theme.of(context);
|
||||
|
||||
return Scaffold(
|
||||
appBar: AppBar(title: const Text('Home')),
|
||||
floatingActionButton: FloatingActionButton.extended(
|
||||
onPressed: () {
|
||||
Navigator.of(context).push(
|
||||
MaterialPageRoute<void>(builder: (_) => const AddItemScreen()),
|
||||
);
|
||||
},
|
||||
icon: const Icon(Icons.add),
|
||||
label: const Text('Add item'),
|
||||
),
|
||||
body: RefreshIndicator(
|
||||
onRefresh: controller.loadItems,
|
||||
child: ResponsiveBody(
|
||||
child: _HomeBody(controller: controller, theme: theme),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class _HomeBody extends StatelessWidget {
|
||||
const _HomeBody({
|
||||
required this.controller,
|
||||
required this.theme,
|
||||
});
|
||||
|
||||
final ItemController controller;
|
||||
final ThemeData theme;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
if (controller.isLoading && controller.items.isEmpty) {
|
||||
return const LoadingView(message: 'Fetching catalog…');
|
||||
}
|
||||
|
||||
if (controller.error != null && controller.items.isEmpty) {
|
||||
return ListView(
|
||||
physics: const AlwaysScrollableScrollPhysics(),
|
||||
children: [
|
||||
EmptyState(
|
||||
icon: Icons.error_outline,
|
||||
title: 'Something went wrong',
|
||||
message: controller.error!,
|
||||
actionLabel: 'Retry',
|
||||
onAction: controller.loadItems,
|
||||
),
|
||||
],
|
||||
);
|
||||
}
|
||||
|
||||
if (controller.items.isEmpty) {
|
||||
return ListView(
|
||||
physics: const AlwaysScrollableScrollPhysics(),
|
||||
children: const [
|
||||
EmptyState(
|
||||
icon: Icons.inbox_outlined,
|
||||
title: 'No items yet',
|
||||
message: 'Add your first item with the button below.',
|
||||
),
|
||||
],
|
||||
);
|
||||
}
|
||||
|
||||
// Header occupies the first slot; remaining slots are catalog cards.
|
||||
return ListView.builder(
|
||||
physics: const AlwaysScrollableScrollPhysics(),
|
||||
padding: const EdgeInsets.only(top: 8, bottom: 96),
|
||||
itemCount: controller.items.length + 1,
|
||||
itemBuilder: (context, index) {
|
||||
if (index == 0) {
|
||||
return Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
_WelcomeBanner(itemCount: controller.count),
|
||||
const SizedBox(height: 20),
|
||||
Text('Featured items', style: theme.textTheme.titleMedium),
|
||||
const SizedBox(height: 12),
|
||||
],
|
||||
);
|
||||
}
|
||||
|
||||
final item = controller.items[index - 1];
|
||||
return Padding(
|
||||
padding: const EdgeInsets.only(bottom: 12),
|
||||
child: ItemCard(item: item, heroScope: 'home'),
|
||||
);
|
||||
},
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class _WelcomeBanner extends StatelessWidget {
|
||||
const _WelcomeBanner({required this.itemCount});
|
||||
|
||||
final int itemCount;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final theme = Theme.of(context);
|
||||
final colors = theme.colorScheme;
|
||||
|
||||
return Container(
|
||||
width: double.infinity,
|
||||
padding: const EdgeInsets.all(20),
|
||||
decoration: BoxDecoration(
|
||||
borderRadius: BorderRadius.circular(20),
|
||||
gradient: LinearGradient(
|
||||
colors: [colors.primary, colors.tertiary],
|
||||
),
|
||||
boxShadow: [
|
||||
BoxShadow(
|
||||
color: colors.primary.withValues(alpha: 0.28),
|
||||
blurRadius: 20,
|
||||
offset: const Offset(0, 10),
|
||||
),
|
||||
],
|
||||
),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(
|
||||
'Welcome back',
|
||||
style: theme.textTheme.labelMedium?.copyWith(
|
||||
color: colors.onPrimary.withValues(alpha: 0.8),
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 4),
|
||||
Text(
|
||||
'Your catalog at a glance',
|
||||
style: theme.textTheme.headlineMedium?.copyWith(
|
||||
color: colors.onPrimary,
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 16),
|
||||
Row(
|
||||
children: [
|
||||
_StatPill(
|
||||
label: 'Items',
|
||||
value: '$itemCount',
|
||||
icon: Icons.collections_bookmark_outlined,
|
||||
),
|
||||
const SizedBox(width: 10),
|
||||
const _StatPill(
|
||||
label: 'Theme',
|
||||
value: 'M3',
|
||||
icon: Icons.palette_outlined,
|
||||
),
|
||||
],
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class _StatPill extends StatelessWidget {
|
||||
const _StatPill({
|
||||
required this.label,
|
||||
required this.value,
|
||||
required this.icon,
|
||||
});
|
||||
|
||||
final String label;
|
||||
final String value;
|
||||
final IconData icon;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final onPrimary = Theme.of(context).colorScheme.onPrimary;
|
||||
return Container(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 8),
|
||||
decoration: BoxDecoration(
|
||||
color: onPrimary.withValues(alpha: 0.14),
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
),
|
||||
child: Row(
|
||||
children: [
|
||||
Icon(icon, size: 16, color: onPrimary),
|
||||
const SizedBox(width: 8),
|
||||
Text(
|
||||
'$value $label',
|
||||
style: Theme.of(context).textTheme.labelMedium?.copyWith(
|
||||
color: onPrimary,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -1,82 +0,0 @@
|
||||
/// Detail route opened from a list card, with a [Hero] matching the list badge.
|
||||
library;
|
||||
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
import '../models/item.dart';
|
||||
import '../utils/helpers.dart';
|
||||
import '../widgets/item_hero_badge.dart';
|
||||
import '../widgets/responsive_body.dart';
|
||||
|
||||
class ItemDetailScreen extends StatelessWidget {
|
||||
const ItemDetailScreen({
|
||||
super.key,
|
||||
required this.item,
|
||||
required this.heroTag,
|
||||
});
|
||||
|
||||
final Item item;
|
||||
final String heroTag;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final theme = Theme.of(context);
|
||||
final colors = theme.colorScheme;
|
||||
|
||||
return Scaffold(
|
||||
appBar: AppBar(title: const Text('Details')),
|
||||
body: ResponsiveBody(
|
||||
child: ListView(
|
||||
children: [
|
||||
const SizedBox(height: 16),
|
||||
Center(
|
||||
child: ItemHeroBadge(item: item, size: 96, heroTag: heroTag),
|
||||
),
|
||||
const SizedBox(height: 24),
|
||||
Text(item.title, style: theme.textTheme.headlineMedium),
|
||||
const SizedBox(height: 12),
|
||||
Wrap(
|
||||
spacing: 8,
|
||||
runSpacing: 8,
|
||||
children: [
|
||||
Chip(
|
||||
avatar: Icon(
|
||||
item.category.icon,
|
||||
size: 16,
|
||||
color: item.category.accent,
|
||||
),
|
||||
label: Text(item.category.label),
|
||||
side: BorderSide(
|
||||
color: item.category.accent.withValues(alpha: 0.4),
|
||||
),
|
||||
),
|
||||
Chip(
|
||||
avatar: Icon(
|
||||
Icons.calendar_today_outlined,
|
||||
size: 16,
|
||||
color: colors.onSurfaceVariant,
|
||||
),
|
||||
label: Text(formatDate(item.createdAt)),
|
||||
),
|
||||
],
|
||||
),
|
||||
const SizedBox(height: 20),
|
||||
Text('Summary', style: theme.textTheme.titleMedium),
|
||||
const SizedBox(height: 8),
|
||||
Text(item.subtitle, style: theme.textTheme.bodyLarge),
|
||||
const SizedBox(height: 20),
|
||||
Text('Description', style: theme.textTheme.titleMedium),
|
||||
const SizedBox(height: 8),
|
||||
Text(item.description, style: theme.textTheme.bodyLarge),
|
||||
const SizedBox(height: 32),
|
||||
FilledButton.tonal(
|
||||
onPressed: () => Navigator.of(context).pop(),
|
||||
child: const Text('Back to list'),
|
||||
),
|
||||
const SizedBox(height: 24),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -1,64 +0,0 @@
|
||||
/// Host scaffold that owns the bottom navigation bar and its four tabs.
|
||||
library;
|
||||
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
import 'home_screen.dart';
|
||||
import 'profile_screen.dart';
|
||||
import 'search_screen.dart';
|
||||
import 'settings_screen.dart';
|
||||
|
||||
/// Switches between Home, Search, Profile, and Settings without stacking routes.
|
||||
class MainShell extends StatefulWidget {
|
||||
const MainShell({super.key});
|
||||
|
||||
@override
|
||||
State<MainShell> createState() => _MainShellState();
|
||||
}
|
||||
|
||||
class _MainShellState extends State<MainShell> {
|
||||
int _index = 0;
|
||||
|
||||
static const _pages = [
|
||||
HomeScreen(),
|
||||
SearchScreen(),
|
||||
ProfileScreen(),
|
||||
SettingsScreen(),
|
||||
];
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Scaffold(
|
||||
body: IndexedStack(
|
||||
index: _index,
|
||||
children: _pages,
|
||||
),
|
||||
bottomNavigationBar: NavigationBar(
|
||||
selectedIndex: _index,
|
||||
onDestinationSelected: (index) => setState(() => _index = index),
|
||||
destinations: const [
|
||||
NavigationDestination(
|
||||
icon: Icon(Icons.home_outlined),
|
||||
selectedIcon: Icon(Icons.home),
|
||||
label: 'Home',
|
||||
),
|
||||
NavigationDestination(
|
||||
icon: Icon(Icons.search_outlined),
|
||||
selectedIcon: Icon(Icons.search),
|
||||
label: 'Search',
|
||||
),
|
||||
NavigationDestination(
|
||||
icon: Icon(Icons.person_outline),
|
||||
selectedIcon: Icon(Icons.person),
|
||||
label: 'Profile',
|
||||
),
|
||||
NavigationDestination(
|
||||
icon: Icon(Icons.settings_outlined),
|
||||
selectedIcon: Icon(Icons.settings),
|
||||
label: 'Settings',
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,129 @@
|
||||
/// Refine a single pile — promote / demote cards (Important Cards pattern).
|
||||
library;
|
||||
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:provider/provider.dart';
|
||||
|
||||
import '../models/value_pile.dart';
|
||||
import '../providers/values_sort_provider.dart';
|
||||
import '../widgets/practice_chrome.dart';
|
||||
import '../widgets/value_card_tile.dart';
|
||||
import '../utils/app_theme.dart';
|
||||
|
||||
class PileReviewScreen extends StatelessWidget {
|
||||
const PileReviewScreen({super.key});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final sort = context.watch<ValuesSortController>();
|
||||
final pile = sort.reviewPile ?? ValuePile.important;
|
||||
final cards = sort.cardsInPile(pile);
|
||||
final text = Theme.of(context).textTheme;
|
||||
final colors = Theme.of(context).colorScheme;
|
||||
|
||||
return PracticeScaffold(
|
||||
header: Padding(
|
||||
padding: const EdgeInsets.fromLTRB(8, 4, 12, 0),
|
||||
child: Row(
|
||||
children: [
|
||||
IconButton(
|
||||
onPressed: sort.goToOverview,
|
||||
icon: const Icon(Icons.arrow_back),
|
||||
),
|
||||
Expanded(
|
||||
child: Text(
|
||||
'Reviewing · ${pile.label}',
|
||||
style: text.labelMedium,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
footer: PrimaryPillButton(
|
||||
label: 'Back to overview',
|
||||
onPressed: sort.goToOverview,
|
||||
),
|
||||
child: ListView(
|
||||
children: [
|
||||
Text(pile.label, style: text.displaySmall),
|
||||
const SizedBox(height: 6),
|
||||
Text(
|
||||
'${cards.length} values in this pile. Promote toward your core or demote when something feels less essential.',
|
||||
style: text.bodyMedium,
|
||||
),
|
||||
const SizedBox(height: 12),
|
||||
SingleChildScrollView(
|
||||
scrollDirection: Axis.horizontal,
|
||||
child: Row(
|
||||
children: ValuePile.values.map((p) {
|
||||
return Padding(
|
||||
padding: const EdgeInsets.only(right: 8),
|
||||
child: ActionChip(
|
||||
avatar: CircleAvatar(
|
||||
backgroundColor: p.accent.withValues(alpha: 0.2),
|
||||
radius: 8,
|
||||
),
|
||||
label: Text('${p.shortLabel} ${sort.countInPile(p)}'),
|
||||
onPressed: () => sort.openPileReview(p),
|
||||
backgroundColor: p == pile
|
||||
? AppTheme.surfaceContainerHigh
|
||||
: AppTheme.surfaceContainerLow,
|
||||
),
|
||||
);
|
||||
}).toList(),
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 16),
|
||||
if (cards.isEmpty)
|
||||
Padding(
|
||||
padding: const EdgeInsets.symmetric(vertical: 40),
|
||||
child: Text(
|
||||
'No cards in this pile yet.',
|
||||
style: text.bodyLarge?.copyWith(color: colors.onSurfaceVariant),
|
||||
textAlign: TextAlign.center,
|
||||
),
|
||||
)
|
||||
else
|
||||
...cards.map((card) {
|
||||
return Padding(
|
||||
padding: const EdgeInsets.only(bottom: 12),
|
||||
child: ValueCardTile(
|
||||
card: card,
|
||||
compact: true,
|
||||
trailing: Row(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
IconButton(
|
||||
tooltip: 'Promote',
|
||||
onPressed: () => _shift(sort, card.id, pile, up: true),
|
||||
icon: const Icon(Icons.arrow_upward),
|
||||
),
|
||||
IconButton(
|
||||
tooltip: 'Demote',
|
||||
onPressed: () =>
|
||||
_shift(sort, card.id, pile, up: false),
|
||||
icon: const Icon(Icons.arrow_downward),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
}),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
void _shift(
|
||||
ValuesSortController sort,
|
||||
String id,
|
||||
ValuePile current, {
|
||||
required bool up,
|
||||
}) {
|
||||
final values = ValuePile.values;
|
||||
final index = values.indexOf(current);
|
||||
final next = up ? index - 1 : index + 1;
|
||||
if (next < 0 || next >= values.length) return;
|
||||
sort.moveCard(id, values[next]);
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,66 @@
|
||||
/// Host that swaps practice stages from [ValuesSortController].
|
||||
library;
|
||||
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:provider/provider.dart';
|
||||
|
||||
import '../providers/values_sort_provider.dart';
|
||||
import 'card_sorting_screen.dart';
|
||||
import 'pile_review_screen.dart';
|
||||
import 'practice_hub_screen.dart';
|
||||
import 'rank_order_screen.dart';
|
||||
import 'reflection_screen.dart';
|
||||
import 'sorted_overview_screen.dart';
|
||||
import 'welcome_screen.dart';
|
||||
|
||||
class PracticeFlowScreen extends StatelessWidget {
|
||||
const PracticeFlowScreen({super.key});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final sort = context.watch<ValuesSortController>();
|
||||
|
||||
if (sort.loading) {
|
||||
return const Scaffold(
|
||||
body: Center(child: CircularProgressIndicator()),
|
||||
);
|
||||
}
|
||||
|
||||
if (sort.error != null) {
|
||||
return Scaffold(
|
||||
body: Center(
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.all(24),
|
||||
child: Column(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
Text('Could not load the values deck.\n${sort.error}'),
|
||||
const SizedBox(height: 12),
|
||||
FilledButton(
|
||||
onPressed: sort.load,
|
||||
child: const Text('Retry'),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
return AnimatedSwitcher(
|
||||
duration: const Duration(milliseconds: 320),
|
||||
child: KeyedSubtree(
|
||||
key: ValueKey(sort.stage),
|
||||
child: switch (sort.stage) {
|
||||
SortStage.welcome => const WelcomeScreen(),
|
||||
SortStage.sorting => const CardSortingScreen(),
|
||||
SortStage.hub => const PracticeHubScreen(),
|
||||
SortStage.overview => const SortedOverviewScreen(),
|
||||
SortStage.pileReview => const PileReviewScreen(),
|
||||
SortStage.ranking => const RankOrderScreen(),
|
||||
SortStage.reflection => const ReflectionScreen(),
|
||||
},
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,447 @@
|
||||
/// Post-sort home — landscape summary and gateways (Stitch Practice Hub).
|
||||
library;
|
||||
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:provider/provider.dart';
|
||||
|
||||
import '../models/value_card.dart';
|
||||
import '../providers/values_sort_provider.dart';
|
||||
import '../widgets/practice_chrome.dart';
|
||||
|
||||
class PracticeHubScreen extends StatelessWidget {
|
||||
const PracticeHubScreen({super.key});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final sort = context.watch<ValuesSortController>();
|
||||
final text = Theme.of(context).textTheme;
|
||||
final colors = Theme.of(context).colorScheme;
|
||||
final answered = sort.totalAnsweredReflections;
|
||||
final slots = sort.totalReflectionSlots;
|
||||
final progress = slots == 0 ? 0.0 : answered / slots;
|
||||
final core = sort.rankedCards.take(5).toList(growable: false);
|
||||
|
||||
return PracticeScaffold(
|
||||
padding: const EdgeInsets.fromLTRB(20, 4, 20, 8),
|
||||
footer: FilledButton.tonal(
|
||||
onPressed: () => _confirmReset(context, sort),
|
||||
style: FilledButton.styleFrom(
|
||||
minimumSize: const Size.fromHeight(52),
|
||||
backgroundColor: colors.surfaceContainerHigh,
|
||||
foregroundColor: colors.onSurface,
|
||||
shape: const StadiumBorder(),
|
||||
),
|
||||
child: Row(
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
children: [
|
||||
Icon(Icons.restart_alt, size: 18, color: colors.outline),
|
||||
const SizedBox(width: 8),
|
||||
Text(
|
||||
'Finish Practice (Reset All)',
|
||||
style: text.labelLarge?.copyWith(color: colors.onSurface),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
child: ListView(
|
||||
children: [
|
||||
Text(
|
||||
'Your Values Landscape',
|
||||
style: text.displaySmall?.copyWith(color: colors.onSurface),
|
||||
),
|
||||
const SizedBox(height: 18),
|
||||
_CoreValuesCard(
|
||||
values: core,
|
||||
onValueTap: (card) => sort.goToReflection(valueId: card.id),
|
||||
),
|
||||
const SizedBox(height: 20),
|
||||
_GatewayCard(
|
||||
icon: Icons.layers_outlined,
|
||||
iconColor: colors.primary,
|
||||
title: 'All Sorted Values',
|
||||
onTap: sort.goToOverview,
|
||||
),
|
||||
const SizedBox(height: 12),
|
||||
_GatewayCard(
|
||||
icon: Icons.format_list_numbered,
|
||||
iconColor: colors.secondary,
|
||||
title: 'Order Top Values',
|
||||
onTap: sort.goToRanking,
|
||||
),
|
||||
const SizedBox(height: 12),
|
||||
_GatewayCard(
|
||||
icon: Icons.edit_note,
|
||||
iconColor: colors.tertiary,
|
||||
title: 'Reflect & Inquire',
|
||||
meta: slots == 0
|
||||
? 'Rank top values first'
|
||||
: '$answered of $slots Answered (${(progress * 100).round()}%)',
|
||||
metaBackground: colors.tertiaryContainer.withValues(alpha: 0.45),
|
||||
metaForeground: colors.onTertiaryContainer,
|
||||
progress: slots == 0 ? null : progress,
|
||||
onTap: sort.coreValues.isEmpty ? null : sort.goToReflection,
|
||||
),
|
||||
const SizedBox(height: 8),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Future<void> _confirmReset(
|
||||
BuildContext context,
|
||||
ValuesSortController sort,
|
||||
) async {
|
||||
final ok = await showModalBottomSheet<bool>(
|
||||
context: context,
|
||||
isScrollControlled: true,
|
||||
builder: (ctx) {
|
||||
final text = Theme.of(ctx).textTheme;
|
||||
final c = Theme.of(ctx).colorScheme;
|
||||
return SafeArea(
|
||||
child: SingleChildScrollView(
|
||||
padding: const EdgeInsets.fromLTRB(24, 8, 24, 24),
|
||||
child: Column(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Row(
|
||||
children: [
|
||||
CircleAvatar(
|
||||
backgroundColor: c.errorContainer.withValues(alpha: 0.5),
|
||||
child: Icon(Icons.hourglass_empty, color: c.error),
|
||||
),
|
||||
const SizedBox(width: 12),
|
||||
Expanded(
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text('Reset Entire Practice?', style: text.titleLarge),
|
||||
Text(
|
||||
'Clean slate contemplation',
|
||||
style: text.labelSmall,
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
const SizedBox(height: 14),
|
||||
Text(
|
||||
'This deliberate action will clear all 5 categorized piles, '
|
||||
'your prioritized hierarchy, and stored reflection notes. '
|
||||
'You will begin this mindful exploration from the initial deck.',
|
||||
style: text.bodyMedium,
|
||||
),
|
||||
const SizedBox(height: 14),
|
||||
Container(
|
||||
padding: const EdgeInsets.all(14),
|
||||
decoration: BoxDecoration(
|
||||
color: c.surfaceContainer,
|
||||
borderRadius: BorderRadius.circular(16),
|
||||
),
|
||||
child: Row(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Icon(Icons.lightbulb_outline,
|
||||
size: 18, color: c.secondary),
|
||||
const SizedBox(width: 8),
|
||||
Expanded(
|
||||
child: Text(
|
||||
'Tip: You can pause here and revisit your values whenever you need clarity in daily choices without resetting.',
|
||||
style: text.bodySmall,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 18),
|
||||
PrimaryPillButton(
|
||||
label: 'Yes, Reset All ${sort.totalCount} Cards',
|
||||
onPressed: () => Navigator.pop(ctx, true),
|
||||
),
|
||||
const SizedBox(height: 8),
|
||||
GhostPillButton(
|
||||
label: 'Keep My Current Landscape',
|
||||
onPressed: () => Navigator.pop(ctx, false),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
},
|
||||
);
|
||||
if (ok == true) sort.restart();
|
||||
}
|
||||
}
|
||||
|
||||
class _CoreValuesCard extends StatelessWidget {
|
||||
const _CoreValuesCard({
|
||||
required this.values,
|
||||
required this.onValueTap,
|
||||
});
|
||||
|
||||
final List<ValueCard> values;
|
||||
final void Function(ValueCard card) onValueTap;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final text = Theme.of(context).textTheme;
|
||||
final colors = Theme.of(context).colorScheme;
|
||||
final accent = colors.secondary;
|
||||
|
||||
return Container(
|
||||
padding: const EdgeInsets.all(16),
|
||||
decoration: BoxDecoration(
|
||||
color: colors.surfaceContainerLow,
|
||||
borderRadius: BorderRadius.circular(22),
|
||||
border: Border.all(color: colors.outlineVariant.withValues(alpha: 0.7)),
|
||||
),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Row(
|
||||
children: [
|
||||
Container(
|
||||
width: 28,
|
||||
height: 28,
|
||||
decoration: BoxDecoration(
|
||||
color: accent.withValues(alpha: 0.18),
|
||||
shape: BoxShape.circle,
|
||||
),
|
||||
child: Icon(Icons.star, size: 15, color: accent),
|
||||
),
|
||||
const SizedBox(width: 10),
|
||||
Expanded(
|
||||
child: Text(
|
||||
'Your Core Values',
|
||||
style: text.titleLarge?.copyWith(
|
||||
color: colors.onSurface,
|
||||
fontWeight: FontWeight.w400,
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
const SizedBox(height: 14),
|
||||
if (values.isEmpty)
|
||||
Padding(
|
||||
padding: const EdgeInsets.symmetric(vertical: 12),
|
||||
child: Text(
|
||||
'Rank your Most Important values to distill your core set here.',
|
||||
style: text.bodyMedium?.copyWith(
|
||||
color: colors.onSurfaceVariant,
|
||||
),
|
||||
),
|
||||
)
|
||||
else
|
||||
LayoutBuilder(
|
||||
builder: (context, constraints) {
|
||||
final gap = 8.0;
|
||||
final chipWidth = (constraints.maxWidth - gap) / 2;
|
||||
return Wrap(
|
||||
spacing: gap,
|
||||
runSpacing: gap,
|
||||
children: [
|
||||
for (var i = 0; i < values.length; i++)
|
||||
SizedBox(
|
||||
width: chipWidth,
|
||||
child: _CoreValueChip(
|
||||
rank: i + 1,
|
||||
title: values[i].title,
|
||||
accent: accent,
|
||||
onTap: () => onValueTap(values[i]),
|
||||
),
|
||||
),
|
||||
],
|
||||
);
|
||||
},
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class _CoreValueChip extends StatelessWidget {
|
||||
const _CoreValueChip({
|
||||
required this.rank,
|
||||
required this.title,
|
||||
required this.accent,
|
||||
required this.onTap,
|
||||
});
|
||||
|
||||
final int rank;
|
||||
final String title;
|
||||
final Color accent;
|
||||
final VoidCallback onTap;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final text = Theme.of(context).textTheme;
|
||||
final colors = Theme.of(context).colorScheme;
|
||||
|
||||
return Material(
|
||||
color: colors.surfaceContainer,
|
||||
borderRadius: BorderRadius.circular(14),
|
||||
child: InkWell(
|
||||
onTap: onTap,
|
||||
borderRadius: BorderRadius.circular(14),
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 10, vertical: 10),
|
||||
child: Row(
|
||||
children: [
|
||||
Container(
|
||||
width: 22,
|
||||
height: 22,
|
||||
alignment: Alignment.center,
|
||||
decoration: BoxDecoration(
|
||||
color: accent.withValues(alpha: 0.18),
|
||||
shape: BoxShape.circle,
|
||||
),
|
||||
child: Text(
|
||||
'$rank',
|
||||
style: text.labelSmall?.copyWith(
|
||||
color: accent,
|
||||
fontWeight: FontWeight.w700,
|
||||
),
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 8),
|
||||
Expanded(
|
||||
child: Text(
|
||||
title,
|
||||
maxLines: 1,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
style: text.labelMedium?.copyWith(
|
||||
color: colors.onSurface,
|
||||
fontWeight: FontWeight.w600,
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class _GatewayCard extends StatelessWidget {
|
||||
const _GatewayCard({
|
||||
required this.icon,
|
||||
required this.iconColor,
|
||||
required this.title,
|
||||
required this.onTap,
|
||||
this.meta,
|
||||
this.metaBackground,
|
||||
this.metaForeground,
|
||||
this.progress,
|
||||
});
|
||||
|
||||
final IconData icon;
|
||||
final Color iconColor;
|
||||
final String title;
|
||||
final String? meta;
|
||||
final Color? metaBackground;
|
||||
final Color? metaForeground;
|
||||
final VoidCallback? onTap;
|
||||
final double? progress;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final text = Theme.of(context).textTheme;
|
||||
final colors = Theme.of(context).colorScheme;
|
||||
final enabled = onTap != null;
|
||||
final hasMeta = meta != null && meta!.isNotEmpty;
|
||||
|
||||
return Opacity(
|
||||
opacity: enabled ? 1 : 0.55,
|
||||
child: Material(
|
||||
color: colors.surfaceContainerLow,
|
||||
elevation: 0,
|
||||
shadowColor: colors.shadow.withValues(alpha: 0.08),
|
||||
shape: RoundedRectangleBorder(
|
||||
borderRadius: BorderRadius.circular(20),
|
||||
),
|
||||
child: InkWell(
|
||||
onTap: onTap,
|
||||
borderRadius: BorderRadius.circular(20),
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.all(18),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Row(
|
||||
crossAxisAlignment: CrossAxisAlignment.center,
|
||||
children: [
|
||||
Container(
|
||||
width: 40,
|
||||
height: 40,
|
||||
decoration: BoxDecoration(
|
||||
color: colors.surfaceContainerHigh,
|
||||
shape: BoxShape.circle,
|
||||
),
|
||||
child: Icon(icon, color: iconColor, size: 22),
|
||||
),
|
||||
const SizedBox(width: 12),
|
||||
Expanded(
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
children: [
|
||||
Text(
|
||||
title,
|
||||
style: text.titleLarge?.copyWith(
|
||||
color: colors.onSurface,
|
||||
fontWeight: FontWeight.w400,
|
||||
),
|
||||
),
|
||||
if (hasMeta) ...[
|
||||
const SizedBox(height: 6),
|
||||
Container(
|
||||
padding: const EdgeInsets.symmetric(
|
||||
horizontal: 10,
|
||||
vertical: 3,
|
||||
),
|
||||
decoration: BoxDecoration(
|
||||
color: metaBackground ?? colors.surfaceContainer,
|
||||
borderRadius: BorderRadius.circular(999),
|
||||
),
|
||||
child: Text(
|
||||
meta!,
|
||||
style: text.labelSmall?.copyWith(
|
||||
color: metaForeground ?? colors.onSurfaceVariant,
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
],
|
||||
),
|
||||
),
|
||||
Icon(
|
||||
Icons.arrow_forward,
|
||||
color: colors.primary,
|
||||
size: 22,
|
||||
),
|
||||
],
|
||||
),
|
||||
if (progress != null) ...[
|
||||
const SizedBox(height: 14),
|
||||
ClipRRect(
|
||||
borderRadius: BorderRadius.circular(999),
|
||||
child: LinearProgressIndicator(
|
||||
value: progress,
|
||||
minHeight: 6,
|
||||
backgroundColor: colors.surfaceContainerHighest,
|
||||
color: colors.tertiary,
|
||||
),
|
||||
),
|
||||
],
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -1,142 +0,0 @@
|
||||
/// Profile tab: avatar, stats, and a shortcut to the add-item form.
|
||||
library;
|
||||
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:provider/provider.dart';
|
||||
|
||||
import '../providers/item_provider.dart';
|
||||
import '../providers/theme_provider.dart';
|
||||
import '../utils/constants.dart';
|
||||
import '../utils/helpers.dart';
|
||||
import '../widgets/responsive_body.dart';
|
||||
import 'add_item_screen.dart';
|
||||
|
||||
class ProfileScreen extends StatelessWidget {
|
||||
const ProfileScreen({super.key});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final items = context.watch<ItemController>();
|
||||
final themeController = context.watch<ThemeController>();
|
||||
final theme = Theme.of(context);
|
||||
final colors = theme.colorScheme;
|
||||
|
||||
return Scaffold(
|
||||
appBar: AppBar(title: const Text('Profile')),
|
||||
body: ResponsiveBody(
|
||||
child: ListView(
|
||||
children: [
|
||||
const SizedBox(height: 12),
|
||||
Center(
|
||||
child: CircleAvatar(
|
||||
radius: 44,
|
||||
backgroundColor: colors.primaryContainer,
|
||||
child: Icon(
|
||||
Icons.person,
|
||||
size: 44,
|
||||
color: colors.onPrimaryContainer,
|
||||
),
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 16),
|
||||
Text(
|
||||
'Alex Rivera',
|
||||
textAlign: TextAlign.center,
|
||||
style: theme.textTheme.headlineMedium,
|
||||
),
|
||||
const SizedBox(height: 4),
|
||||
Text(
|
||||
'[email protected]',
|
||||
textAlign: TextAlign.center,
|
||||
style: theme.textTheme.bodyMedium,
|
||||
),
|
||||
const SizedBox(height: 24),
|
||||
Row(
|
||||
children: [
|
||||
Expanded(
|
||||
child: _ProfileStat(
|
||||
label: 'Items',
|
||||
value: '${items.count}',
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 12),
|
||||
Expanded(
|
||||
child: _ProfileStat(
|
||||
label: 'Theme',
|
||||
value: labelForThemeMode(themeController.themeMode),
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 12),
|
||||
Expanded(
|
||||
child: _ProfileStat(
|
||||
label: 'Source',
|
||||
value: items.useRemoteData ? 'Remote' : 'Local',
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
const SizedBox(height: 24),
|
||||
Card(
|
||||
child: Column(
|
||||
children: [
|
||||
ListTile(
|
||||
leading: const Icon(Icons.add_box_outlined),
|
||||
title: const Text('Add a catalog item'),
|
||||
subtitle: const Text('Validated form with category picker'),
|
||||
trailing: const Icon(Icons.chevron_right),
|
||||
onTap: () {
|
||||
Navigator.of(context).push(
|
||||
MaterialPageRoute<void>(
|
||||
builder: (_) => const AddItemScreen(),
|
||||
),
|
||||
);
|
||||
},
|
||||
),
|
||||
const Divider(height: 1),
|
||||
const ListTile(
|
||||
leading: Icon(Icons.info_outline),
|
||||
title: Text('About'),
|
||||
subtitle: Text('$kAppName · $kPackageName'),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class _ProfileStat extends StatelessWidget {
|
||||
const _ProfileStat({required this.label, required this.value});
|
||||
|
||||
final String label;
|
||||
final String value;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final theme = Theme.of(context);
|
||||
return Container(
|
||||
padding: const EdgeInsets.symmetric(vertical: 16),
|
||||
decoration: BoxDecoration(
|
||||
color: theme.colorScheme.surfaceContainerLow,
|
||||
borderRadius: BorderRadius.circular(16),
|
||||
boxShadow: [
|
||||
BoxShadow(
|
||||
color: theme.shadowColor.withValues(alpha: 0.06),
|
||||
blurRadius: 12,
|
||||
offset: const Offset(0, 4),
|
||||
),
|
||||
],
|
||||
),
|
||||
child: Column(
|
||||
children: [
|
||||
Text(value, style: theme.textTheme.titleLarge),
|
||||
const SizedBox(height: 4),
|
||||
Text(label, style: theme.textTheme.labelMedium),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,191 @@
|
||||
/// Rank-order the Most Important nominees into a personal hierarchy.
|
||||
library;
|
||||
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:provider/provider.dart';
|
||||
|
||||
import '../providers/values_sort_provider.dart';
|
||||
import '../widgets/practice_chrome.dart';
|
||||
|
||||
class RankOrderScreen extends StatelessWidget {
|
||||
const RankOrderScreen({super.key});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final sort = context.watch<ValuesSortController>();
|
||||
final ranked = sort.rankedCards;
|
||||
final text = Theme.of(context).textTheme;
|
||||
final colors = Theme.of(context).colorScheme;
|
||||
|
||||
return PracticeScaffold(
|
||||
header: Padding(
|
||||
padding: const EdgeInsets.fromLTRB(8, 4, 12, 0),
|
||||
child: Row(
|
||||
children: [
|
||||
IconButton(
|
||||
onPressed: sort.goToHub,
|
||||
icon: const Icon(Icons.arrow_back),
|
||||
),
|
||||
Expanded(
|
||||
child: Text(
|
||||
'Stage 3 · Prioritization',
|
||||
style: text.labelMedium,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
footer: PrimaryPillButton(
|
||||
label: 'Reflect on top values',
|
||||
icon: Icons.spa_outlined,
|
||||
onPressed: ranked.isEmpty ? null : sort.goToReflection,
|
||||
),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text('Order Your Core Values', style: text.displaySmall),
|
||||
const SizedBox(height: 6),
|
||||
Text(
|
||||
'Drag or reorder your finalists. Let #1 represent your non-negotiable value.',
|
||||
style: text.bodyMedium,
|
||||
),
|
||||
const SizedBox(height: 12),
|
||||
if (ranked.isEmpty)
|
||||
Expanded(
|
||||
child: Center(
|
||||
child: Text(
|
||||
'Promote a few values into Most Important first.',
|
||||
style: text.bodyLarge?.copyWith(color: colors.onSurfaceVariant),
|
||||
textAlign: TextAlign.center,
|
||||
),
|
||||
),
|
||||
)
|
||||
else
|
||||
Expanded(
|
||||
child: ReorderableListView.builder(
|
||||
itemCount: ranked.length,
|
||||
onReorderItem: sort.reorderRanked,
|
||||
proxyDecorator: (child, index, animation) {
|
||||
return Material(
|
||||
elevation: 6,
|
||||
color: Colors.transparent,
|
||||
shadowColor: const Color(0x332C2825),
|
||||
child: child,
|
||||
);
|
||||
},
|
||||
itemBuilder: (context, index) {
|
||||
final card = ranked[index];
|
||||
final isPrimary = index == 0;
|
||||
return Container(
|
||||
key: ValueKey(card.id),
|
||||
margin: const EdgeInsets.only(bottom: 10),
|
||||
padding: const EdgeInsets.fromLTRB(12, 12, 4, 12),
|
||||
decoration: BoxDecoration(
|
||||
color: isPrimary
|
||||
? colors.surfaceContainerLowest
|
||||
: colors.surfaceContainerLow,
|
||||
borderRadius: BorderRadius.circular(20),
|
||||
border: Border.all(
|
||||
color: isPrimary
|
||||
? colors.secondary.withValues(alpha: 0.5)
|
||||
: colors.outlineVariant,
|
||||
),
|
||||
),
|
||||
child: Row(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
SizedBox(
|
||||
width: 36,
|
||||
child: Column(
|
||||
children: [
|
||||
Text(
|
||||
'${index + 1}',
|
||||
style: text.titleLarge?.copyWith(
|
||||
color: isPrimary
|
||||
? colors.secondary
|
||||
: colors.primary,
|
||||
),
|
||||
),
|
||||
if (isPrimary)
|
||||
Icon(
|
||||
Icons.star,
|
||||
size: 14,
|
||||
color: colors.secondary,
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 8),
|
||||
Expanded(
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(
|
||||
card.title,
|
||||
style: text.titleLarge?.copyWith(
|
||||
color: colors.onSurface,
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 4),
|
||||
Text(
|
||||
card.description,
|
||||
maxLines: 2,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
style: text.bodyMedium?.copyWith(
|
||||
color: colors.onSurfaceVariant,
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 4),
|
||||
Text(
|
||||
'Pillar: ${card.domain}',
|
||||
style: text.labelSmall?.copyWith(
|
||||
color: colors.onSurfaceVariant,
|
||||
),
|
||||
),
|
||||
|
||||
],
|
||||
),
|
||||
),
|
||||
Column(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
IconButton(
|
||||
visualDensity: VisualDensity.compact,
|
||||
padding: EdgeInsets.zero,
|
||||
constraints: const BoxConstraints(
|
||||
minWidth: 32,
|
||||
minHeight: 28,
|
||||
),
|
||||
onPressed: () => sort.moveRank(index, up: true),
|
||||
icon: const Icon(Icons.keyboard_arrow_up, size: 22),
|
||||
),
|
||||
ReorderableDragStartListener(
|
||||
index: index,
|
||||
child: const Padding(
|
||||
padding: EdgeInsets.symmetric(vertical: 2),
|
||||
child: Icon(Icons.drag_indicator, size: 22),
|
||||
),
|
||||
),
|
||||
IconButton(
|
||||
visualDensity: VisualDensity.compact,
|
||||
padding: EdgeInsets.zero,
|
||||
constraints: const BoxConstraints(
|
||||
minWidth: 32,
|
||||
minHeight: 28,
|
||||
),
|
||||
onPressed: () => sort.moveRank(index, up: false),
|
||||
icon: const Icon(Icons.keyboard_arrow_down, size: 22),
|
||||
),
|
||||
],
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
},
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,298 @@
|
||||
/// Deep reflection on top values, with optional full-screen journal sheet.
|
||||
library;
|
||||
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:provider/provider.dart';
|
||||
|
||||
import '../providers/values_sort_provider.dart';
|
||||
import '../widgets/practice_chrome.dart';
|
||||
|
||||
class ReflectionScreen extends StatelessWidget {
|
||||
const ReflectionScreen({super.key});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final sort = context.watch<ValuesSortController>();
|
||||
final cores = sort.coreValues;
|
||||
final activeId = sort.activeReflectionValueId ??
|
||||
(cores.isEmpty ? null : cores.first.id);
|
||||
final active = activeId == null ? null : sort.cardById(activeId);
|
||||
final text = Theme.of(context).textTheme;
|
||||
final colors = Theme.of(context).colorScheme;
|
||||
|
||||
return PracticeScaffold(
|
||||
header: Padding(
|
||||
padding: const EdgeInsets.fromLTRB(8, 4, 12, 0),
|
||||
child: Row(
|
||||
children: [
|
||||
IconButton(
|
||||
onPressed: sort.goToHub,
|
||||
icon: const Icon(Icons.arrow_back),
|
||||
),
|
||||
Expanded(
|
||||
child: Text(
|
||||
'Step 5 · Deep Reflection',
|
||||
style: text.labelMedium,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
child: cores.isEmpty || active == null
|
||||
? Center(
|
||||
child: Text(
|
||||
'Rank at least one core value to reflect.',
|
||||
style: text.bodyLarge,
|
||||
),
|
||||
)
|
||||
: ListView(
|
||||
children: [
|
||||
Text('Your Core Values', style: text.displaySmall),
|
||||
const SizedBox(height: 4),
|
||||
Text(
|
||||
'${cores.length} core anchors · '
|
||||
'${sort.totalAnsweredReflections} of ${sort.totalReflectionSlots} answered',
|
||||
style: text.bodyMedium,
|
||||
),
|
||||
const SizedBox(height: 14),
|
||||
SizedBox(
|
||||
height: 88,
|
||||
child: ListView.separated(
|
||||
scrollDirection: Axis.horizontal,
|
||||
itemCount: cores.length,
|
||||
separatorBuilder: (_, _) => const SizedBox(width: 8),
|
||||
itemBuilder: (context, index) {
|
||||
final card = cores[index];
|
||||
final selected = card.id == active.id;
|
||||
final answered = sort.answeredPromptCount(card.id);
|
||||
final rankColor =
|
||||
selected ? colors.onPrimary : colors.secondary;
|
||||
final titleColor =
|
||||
selected ? colors.onPrimary : colors.onSurface;
|
||||
final metaColor = selected
|
||||
? colors.onPrimary.withValues(alpha: 0.85)
|
||||
: colors.onSurfaceVariant;
|
||||
return InkWell(
|
||||
onTap: () => sort.selectReflectionValue(card.id),
|
||||
borderRadius: BorderRadius.circular(16),
|
||||
child: Container(
|
||||
width: 120,
|
||||
padding: const EdgeInsets.all(12),
|
||||
decoration: BoxDecoration(
|
||||
color: selected
|
||||
? colors.primary
|
||||
: colors.surfaceContainerLow,
|
||||
borderRadius: BorderRadius.circular(16),
|
||||
border: Border.all(
|
||||
color: selected
|
||||
? colors.primary
|
||||
: colors.outlineVariant,
|
||||
width: selected ? 2 : 1,
|
||||
),
|
||||
),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(
|
||||
'#${index + 1}',
|
||||
style: text.labelSmall?.copyWith(
|
||||
color: rankColor,
|
||||
fontWeight: FontWeight.w700,
|
||||
),
|
||||
),
|
||||
Text(
|
||||
card.title,
|
||||
maxLines: 1,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
style: text.titleMedium?.copyWith(
|
||||
color: titleColor,
|
||||
fontWeight: selected
|
||||
? FontWeight.w700
|
||||
: FontWeight.w500,
|
||||
),
|
||||
),
|
||||
Text(
|
||||
'$answered/${kReflectionPrompts.length}',
|
||||
style: text.labelSmall?.copyWith(
|
||||
color: metaColor,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
},
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 18),
|
||||
Text(active.title, style: text.headlineMedium),
|
||||
const SizedBox(height: 4),
|
||||
Text(
|
||||
'"${active.description}"',
|
||||
style: text.bodyMedium?.copyWith(fontStyle: FontStyle.italic),
|
||||
),
|
||||
const SizedBox(height: 16),
|
||||
...List.generate(kReflectionPrompts.length, (index) {
|
||||
final answer = sort.reflectionFor(active.id, index);
|
||||
final answered = answer.isNotEmpty;
|
||||
return Padding(
|
||||
padding: const EdgeInsets.only(bottom: 10),
|
||||
child: Material(
|
||||
color: colors.surfaceContainerLow,
|
||||
shape: RoundedRectangleBorder(
|
||||
borderRadius: BorderRadius.circular(18),
|
||||
side: BorderSide(color: colors.outlineVariant),
|
||||
),
|
||||
child: ListTile(
|
||||
leading: Icon(
|
||||
answered ? Icons.check_circle : Icons.circle_outlined,
|
||||
color: answered
|
||||
? colors.tertiary
|
||||
: colors.onSurfaceVariant,
|
||||
),
|
||||
title: Text(
|
||||
kReflectionPrompts[index],
|
||||
style: text.titleMedium,
|
||||
),
|
||||
subtitle: answered
|
||||
? Text(
|
||||
answer,
|
||||
maxLines: 2,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
)
|
||||
: null,
|
||||
trailing: Icon(
|
||||
answered ? Icons.edit_outlined : Icons.open_in_full,
|
||||
),
|
||||
onTap: () => _openJournal(
|
||||
context,
|
||||
sort,
|
||||
active.id,
|
||||
index,
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
}),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Future<void> _openJournal(
|
||||
BuildContext context,
|
||||
ValuesSortController sort,
|
||||
String valueId,
|
||||
int promptIndex,
|
||||
) async {
|
||||
sort.selectPrompt(promptIndex);
|
||||
final card = sort.cardById(valueId);
|
||||
if (card == null) return;
|
||||
|
||||
await showModalBottomSheet<void>(
|
||||
context: context,
|
||||
isScrollControlled: true,
|
||||
useSafeArea: true,
|
||||
builder: (ctx) => _ReflectionJournalSheet(
|
||||
cardTitle: card.title,
|
||||
prompt: kReflectionPrompts[promptIndex],
|
||||
initialText: sort.reflectionFor(valueId, promptIndex),
|
||||
onSave: (text) {
|
||||
sort.setReflection(valueId, promptIndex, text);
|
||||
},
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class _ReflectionJournalSheet extends StatefulWidget {
|
||||
const _ReflectionJournalSheet({
|
||||
required this.cardTitle,
|
||||
required this.prompt,
|
||||
required this.initialText,
|
||||
required this.onSave,
|
||||
});
|
||||
|
||||
final String cardTitle;
|
||||
final String prompt;
|
||||
final String initialText;
|
||||
final ValueChanged<String> onSave;
|
||||
|
||||
@override
|
||||
State<_ReflectionJournalSheet> createState() =>
|
||||
_ReflectionJournalSheetState();
|
||||
}
|
||||
|
||||
class _ReflectionJournalSheetState extends State<_ReflectionJournalSheet> {
|
||||
late final TextEditingController _controller;
|
||||
|
||||
@override
|
||||
void initState() {
|
||||
super.initState();
|
||||
_controller = TextEditingController(text: widget.initialText);
|
||||
}
|
||||
|
||||
@override
|
||||
void dispose() {
|
||||
_controller.dispose();
|
||||
super.dispose();
|
||||
}
|
||||
|
||||
void _saveAndClose() {
|
||||
widget.onSave(_controller.text);
|
||||
Navigator.of(context).pop();
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final text = Theme.of(context).textTheme;
|
||||
final colors = Theme.of(context).colorScheme;
|
||||
final bottom = MediaQuery.viewInsetsOf(context).bottom;
|
||||
|
||||
return Padding(
|
||||
padding: EdgeInsets.fromLTRB(20, 8, 20, bottom + 20),
|
||||
child: Column(
|
||||
children: [
|
||||
Row(
|
||||
children: [
|
||||
Expanded(
|
||||
child: Text(
|
||||
'Reflection · ${widget.cardTitle}',
|
||||
style: text.titleLarge,
|
||||
),
|
||||
),
|
||||
IconButton(
|
||||
onPressed: () => Navigator.pop(context),
|
||||
icon: const Icon(Icons.close),
|
||||
),
|
||||
],
|
||||
),
|
||||
Align(
|
||||
alignment: Alignment.centerLeft,
|
||||
child: Text(
|
||||
widget.prompt,
|
||||
style: text.bodyLarge?.copyWith(color: colors.onSurfaceVariant),
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 12),
|
||||
Expanded(
|
||||
child: TextField(
|
||||
controller: _controller,
|
||||
expands: true,
|
||||
maxLines: null,
|
||||
textAlignVertical: TextAlignVertical.top,
|
||||
decoration: const InputDecoration(
|
||||
hintText: 'Write freely. This stays on your device.',
|
||||
),
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 12),
|
||||
PrimaryPillButton(
|
||||
label: 'Save reflection',
|
||||
onPressed: _saveAndClose,
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -1,104 +0,0 @@
|
||||
/// Search tab: query field plus a [ListView.builder] of matching items.
|
||||
library;
|
||||
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:provider/provider.dart';
|
||||
|
||||
import '../models/item.dart';
|
||||
import '../providers/item_provider.dart';
|
||||
import '../widgets/empty_state.dart';
|
||||
import '../widgets/item_card.dart';
|
||||
import '../widgets/responsive_body.dart';
|
||||
|
||||
class SearchScreen extends StatefulWidget {
|
||||
const SearchScreen({super.key});
|
||||
|
||||
@override
|
||||
State<SearchScreen> createState() => _SearchScreenState();
|
||||
}
|
||||
|
||||
class _SearchScreenState extends State<SearchScreen> {
|
||||
final _query = TextEditingController();
|
||||
|
||||
@override
|
||||
void dispose() {
|
||||
_query.dispose();
|
||||
super.dispose();
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final results = context.watch<ItemController>().search(_query.text);
|
||||
|
||||
return Scaffold(
|
||||
appBar: AppBar(title: const Text('Search')),
|
||||
body: ResponsiveBody(
|
||||
child: Column(
|
||||
children: [
|
||||
const SizedBox(height: 8),
|
||||
TextField(
|
||||
controller: _query,
|
||||
textInputAction: TextInputAction.search,
|
||||
onChanged: (_) => setState(() {}),
|
||||
decoration: InputDecoration(
|
||||
hintText: 'Title, summary, or category',
|
||||
prefixIcon: const Icon(Icons.search),
|
||||
suffixIcon: _query.text.isEmpty
|
||||
? null
|
||||
: IconButton(
|
||||
tooltip: 'Clear',
|
||||
onPressed: () {
|
||||
_query.clear();
|
||||
setState(() {});
|
||||
},
|
||||
icon: const Icon(Icons.close),
|
||||
),
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 8),
|
||||
Align(
|
||||
alignment: Alignment.centerLeft,
|
||||
child: Text(
|
||||
'${results.length} result${results.length == 1 ? '' : 's'}',
|
||||
style: Theme.of(context).textTheme.labelMedium,
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 8),
|
||||
Expanded(child: _ResultsList(results: results, query: _query.text)),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class _ResultsList extends StatelessWidget {
|
||||
const _ResultsList({required this.results, required this.query});
|
||||
|
||||
final List<Item> results;
|
||||
final String query;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
if (results.isEmpty) {
|
||||
return EmptyState(
|
||||
icon: Icons.search_off,
|
||||
title: query.trim().isEmpty ? 'Start typing' : 'No matches',
|
||||
message: query.trim().isEmpty
|
||||
? 'Search the catalog by title, summary, or category.'
|
||||
: 'Try a different keyword.',
|
||||
);
|
||||
}
|
||||
|
||||
return ListView.builder(
|
||||
padding: const EdgeInsets.only(bottom: 24),
|
||||
itemCount: results.length,
|
||||
itemBuilder: (context, index) {
|
||||
return Padding(
|
||||
padding: const EdgeInsets.only(bottom: 12),
|
||||
child: ItemCard(item: results[index], heroScope: 'search'),
|
||||
);
|
||||
},
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -1,104 +0,0 @@
|
||||
/// Settings tab: theme mode, data source, and about information.
|
||||
library;
|
||||
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:provider/provider.dart';
|
||||
|
||||
import '../providers/item_provider.dart';
|
||||
import '../providers/theme_provider.dart';
|
||||
import '../utils/constants.dart';
|
||||
import '../utils/helpers.dart';
|
||||
import '../widgets/responsive_body.dart';
|
||||
|
||||
class SettingsScreen extends StatelessWidget {
|
||||
const SettingsScreen({super.key});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final themeController = context.watch<ThemeController>();
|
||||
final items = context.watch<ItemController>();
|
||||
final theme = Theme.of(context);
|
||||
|
||||
return Scaffold(
|
||||
appBar: AppBar(title: const Text('Settings')),
|
||||
body: ResponsiveBody(
|
||||
child: ListView(
|
||||
children: [
|
||||
const SizedBox(height: 8),
|
||||
Text('Appearance', style: theme.textTheme.titleMedium),
|
||||
const SizedBox(height: 8),
|
||||
Text(
|
||||
'Theme is saved with shared_preferences and restored on launch.',
|
||||
style: theme.textTheme.bodyMedium,
|
||||
),
|
||||
const SizedBox(height: 16),
|
||||
SegmentedButton<ThemeMode>(
|
||||
segments: const [
|
||||
ButtonSegment(
|
||||
value: ThemeMode.system,
|
||||
label: Text('System'),
|
||||
icon: Icon(Icons.brightness_auto),
|
||||
),
|
||||
ButtonSegment(
|
||||
value: ThemeMode.light,
|
||||
label: Text('Light'),
|
||||
icon: Icon(Icons.light_mode_outlined),
|
||||
),
|
||||
ButtonSegment(
|
||||
value: ThemeMode.dark,
|
||||
label: Text('Dark'),
|
||||
icon: Icon(Icons.dark_mode_outlined),
|
||||
),
|
||||
],
|
||||
selected: {themeController.themeMode},
|
||||
onSelectionChanged: (selection) {
|
||||
themeController.setThemeMode(selection.first);
|
||||
},
|
||||
),
|
||||
const SizedBox(height: 28),
|
||||
Text('Data', style: theme.textTheme.titleMedium),
|
||||
const SizedBox(height: 8),
|
||||
Card(
|
||||
child: SwitchListTile(
|
||||
title: const Text('Use remote sample API'),
|
||||
subtitle: const Text(
|
||||
'When on, items are fetched with the http package from '
|
||||
'JSONPlaceholder. Failures fall back to local mock data.',
|
||||
),
|
||||
value: items.useRemoteData,
|
||||
onChanged: (value) => items.setUseRemoteData(value),
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 28),
|
||||
Text('About', style: theme.textTheme.titleMedium),
|
||||
const SizedBox(height: 8),
|
||||
Card(
|
||||
child: Column(
|
||||
children: [
|
||||
const ListTile(
|
||||
leading: Icon(Icons.apps),
|
||||
title: Text(kAppName),
|
||||
subtitle: Text('Generic Flutter Android starter'),
|
||||
),
|
||||
const Divider(height: 1),
|
||||
const ListTile(
|
||||
leading: Icon(Icons.fingerprint),
|
||||
title: Text('Package'),
|
||||
subtitle: Text(kPackageName),
|
||||
),
|
||||
const Divider(height: 1),
|
||||
ListTile(
|
||||
leading: const Icon(Icons.contrast),
|
||||
title: const Text('Active theme'),
|
||||
subtitle: Text(labelForThemeMode(themeController.themeMode)),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 24),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,289 @@
|
||||
/// Bird's-eye overview of all five piles with demote / refine actions.
|
||||
library;
|
||||
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:provider/provider.dart';
|
||||
|
||||
import '../models/value_card.dart';
|
||||
import '../models/value_pile.dart';
|
||||
import '../providers/values_sort_provider.dart';
|
||||
import '../widgets/practice_chrome.dart';
|
||||
import '../widgets/value_card_tile.dart';
|
||||
|
||||
class SortedOverviewScreen extends StatefulWidget {
|
||||
const SortedOverviewScreen({super.key});
|
||||
|
||||
@override
|
||||
State<SortedOverviewScreen> createState() => _SortedOverviewScreenState();
|
||||
}
|
||||
|
||||
class _SortedOverviewScreenState extends State<SortedOverviewScreen> {
|
||||
String _query = '';
|
||||
ValuePile? _filter;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final sort = context.watch<ValuesSortController>();
|
||||
final text = Theme.of(context).textTheme;
|
||||
final colors = Theme.of(context).colorScheme;
|
||||
|
||||
return PracticeScaffold(
|
||||
header: Padding(
|
||||
padding: const EdgeInsets.fromLTRB(8, 4, 12, 0),
|
||||
child: Row(
|
||||
children: [
|
||||
IconButton(
|
||||
onPressed: sort.goToHub,
|
||||
icon: const Icon(Icons.arrow_back),
|
||||
),
|
||||
Expanded(
|
||||
child: Text(
|
||||
'All Sorted Values',
|
||||
style: text.labelMedium,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
child: ListView(
|
||||
children: [
|
||||
Text('All Sorted Values', style: text.displaySmall),
|
||||
const SizedBox(height: 16),
|
||||
TextField(
|
||||
onChanged: (v) => setState(() => _query = v.trim().toLowerCase()),
|
||||
decoration: const InputDecoration(
|
||||
hintText: 'Find a value (e.g., Creativity)',
|
||||
prefixIcon: Icon(Icons.search),
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 10),
|
||||
SingleChildScrollView(
|
||||
scrollDirection: Axis.horizontal,
|
||||
child: Row(
|
||||
children: [
|
||||
_FilterChip(
|
||||
label: 'All (${sort.totalCount})',
|
||||
selected: _filter == null,
|
||||
onTap: () => setState(() => _filter = null),
|
||||
),
|
||||
...ValuePile.values.map((pile) {
|
||||
return _FilterChip(
|
||||
label: '${pile.shortLabel} (${sort.countInPile(pile)})',
|
||||
selected: _filter == pile,
|
||||
accent: pile.accent,
|
||||
onTap: () => setState(() => _filter = pile),
|
||||
);
|
||||
}),
|
||||
],
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 18),
|
||||
...ValuePile.values
|
||||
.where((p) => _filter == null || _filter == p)
|
||||
.map((pile) {
|
||||
final cards = sort.cardsInPile(pile).where((c) {
|
||||
if (_query.isEmpty) return true;
|
||||
return c.title.toLowerCase().contains(_query) ||
|
||||
c.description.toLowerCase().contains(_query);
|
||||
}).toList();
|
||||
|
||||
return _PileSection(
|
||||
pile: pile,
|
||||
cards: cards,
|
||||
onDemote: (card) => _showDemoteSheet(context, sort, card),
|
||||
);
|
||||
}),
|
||||
const SizedBox(height: 12),
|
||||
Text(
|
||||
'Tip: refine any pile before ranking your core values.',
|
||||
style: text.bodySmall?.copyWith(color: colors.onSurfaceVariant),
|
||||
textAlign: TextAlign.center,
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Future<void> _showDemoteSheet(
|
||||
BuildContext context,
|
||||
ValuesSortController sort,
|
||||
ValueCard card,
|
||||
) async {
|
||||
await showModalBottomSheet<void>(
|
||||
context: context,
|
||||
isScrollControlled: true,
|
||||
builder: (ctx) {
|
||||
final text = Theme.of(ctx).textTheme;
|
||||
final colors = Theme.of(ctx).colorScheme;
|
||||
final maxHeight = MediaQuery.sizeOf(ctx).height * 0.75;
|
||||
return SafeArea(
|
||||
child: ConstrainedBox(
|
||||
constraints: BoxConstraints(maxHeight: maxHeight),
|
||||
child: SingleChildScrollView(
|
||||
padding: EdgeInsets.fromLTRB(
|
||||
24,
|
||||
8,
|
||||
24,
|
||||
MediaQuery.paddingOf(ctx).bottom + 24,
|
||||
),
|
||||
child: Column(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Row(
|
||||
children: [
|
||||
Expanded(
|
||||
child: Text(
|
||||
'Reorder ${card.title}',
|
||||
style: text.titleLarge,
|
||||
),
|
||||
),
|
||||
IconButton(
|
||||
onPressed: () => Navigator.pop(ctx),
|
||||
icon: const Icon(Icons.close),
|
||||
),
|
||||
],
|
||||
),
|
||||
Text('Move to pile:', style: text.bodyMedium),
|
||||
const SizedBox(height: 8),
|
||||
...ValuePile.values.map((pile) {
|
||||
final current = sort.assignments[card.id] == pile;
|
||||
return ListTile(
|
||||
contentPadding: EdgeInsets.zero,
|
||||
enabled: !current,
|
||||
leading: CircleAvatar(
|
||||
backgroundColor: pile.accent.withValues(alpha: 0.2),
|
||||
child: Text(
|
||||
'${pile.rank}',
|
||||
style: text.labelMedium?.copyWith(color: pile.accent),
|
||||
),
|
||||
),
|
||||
title: Text(pile.label),
|
||||
subtitle: Text(pile.subtitle),
|
||||
trailing: current
|
||||
? Icon(Icons.check, color: colors.primary)
|
||||
: Icon(Icons.arrow_forward, color: colors.onSurfaceVariant),
|
||||
onTap: current
|
||||
? null
|
||||
: () {
|
||||
sort.moveCard(card.id, pile);
|
||||
Navigator.pop(ctx);
|
||||
},
|
||||
);
|
||||
}),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
},
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class _FilterChip extends StatelessWidget {
|
||||
const _FilterChip({
|
||||
required this.label,
|
||||
required this.selected,
|
||||
required this.onTap,
|
||||
this.accent,
|
||||
});
|
||||
|
||||
final String label;
|
||||
final bool selected;
|
||||
final VoidCallback onTap;
|
||||
final Color? accent;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final colors = Theme.of(context).colorScheme;
|
||||
final labelColor = selected ? colors.onPrimary : colors.onSurface;
|
||||
return Padding(
|
||||
padding: const EdgeInsets.only(right: 8),
|
||||
child: ChoiceChip(
|
||||
label: Text(label),
|
||||
selected: selected,
|
||||
onSelected: (_) => onTap(),
|
||||
showCheckmark: true,
|
||||
checkmarkColor: colors.onPrimary,
|
||||
selectedColor: colors.primary,
|
||||
backgroundColor: colors.surfaceContainer,
|
||||
labelStyle: Theme.of(context).textTheme.labelMedium?.copyWith(
|
||||
color: labelColor,
|
||||
fontWeight: selected ? FontWeight.w700 : FontWeight.w500,
|
||||
),
|
||||
side: BorderSide(
|
||||
color: selected
|
||||
? colors.primary
|
||||
: (accent ?? colors.outlineVariant),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class _PileSection extends StatelessWidget {
|
||||
const _PileSection({
|
||||
required this.pile,
|
||||
required this.cards,
|
||||
required this.onDemote,
|
||||
});
|
||||
|
||||
final ValuePile pile;
|
||||
final List<ValueCard> cards;
|
||||
final void Function(ValueCard card) onDemote;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final text = Theme.of(context).textTheme;
|
||||
|
||||
return Padding(
|
||||
padding: const EdgeInsets.only(bottom: 22),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Row(
|
||||
children: [
|
||||
Icon(Icons.circle, size: 12, color: pile.accent),
|
||||
const SizedBox(width: 8),
|
||||
Expanded(
|
||||
child: Text(
|
||||
'${pile.label} · ${cards.length} cards',
|
||||
style: text.titleLarge,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
const SizedBox(height: 8),
|
||||
if (pile == ValuePile.mostImportant)
|
||||
...cards.map(
|
||||
(card) => Padding(
|
||||
padding: const EdgeInsets.only(bottom: 10),
|
||||
child: ValueCardTile(
|
||||
card: card,
|
||||
compact: true,
|
||||
trailing: TextButton(
|
||||
onPressed: () => onDemote(card),
|
||||
child: const Text('Reorder'),
|
||||
),
|
||||
),
|
||||
),
|
||||
)
|
||||
else
|
||||
Wrap(
|
||||
spacing: 8,
|
||||
runSpacing: 8,
|
||||
children: cards
|
||||
.map(
|
||||
(c) => ValueChip(
|
||||
title: c.title,
|
||||
onTap: () => onDemote(c),
|
||||
),
|
||||
)
|
||||
.toList(),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -1,12 +1,12 @@
|
||||
/// First route shown after launch. Hands off to [MainShell] after a short delay.
|
||||
/// First route shown after launch. Hands off to the practice flow.
|
||||
library;
|
||||
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
import '../utils/constants.dart';
|
||||
import 'main_shell.dart';
|
||||
import 'practice_flow_screen.dart';
|
||||
|
||||
/// Branded splash with a fade-in logo. Replaced by the bottom-nav shell.
|
||||
/// Soft branded splash before the welcome screen.
|
||||
class SplashScreen extends StatefulWidget {
|
||||
const SplashScreen({super.key});
|
||||
|
||||
@@ -32,17 +32,17 @@ class _SplashScreenState extends State<SplashScreen>
|
||||
CurvedAnimation(parent: _controller, curve: Curves.easeOutBack),
|
||||
);
|
||||
_controller.forward();
|
||||
_goToShell();
|
||||
_goToPractice();
|
||||
}
|
||||
|
||||
Future<void> _goToShell() async {
|
||||
Future<void> _goToPractice() async {
|
||||
await Future<void>.delayed(kSplashDuration);
|
||||
if (!mounted) return;
|
||||
Navigator.of(context).pushReplacement(
|
||||
PageRouteBuilder<void>(
|
||||
pageBuilder: (_, animation, _) => FadeTransition(
|
||||
opacity: animation,
|
||||
child: const MainShell(),
|
||||
child: const PracticeFlowScreen(),
|
||||
),
|
||||
transitionDuration: const Duration(milliseconds: 400),
|
||||
),
|
||||
@@ -57,20 +57,27 @@ class _SplashScreenState extends State<SplashScreen>
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final colors = Theme.of(context).colorScheme;
|
||||
final textTheme = Theme.of(context).textTheme;
|
||||
|
||||
final colors = Theme.of(context).colorScheme;
|
||||
final isDark = colors.brightness == Brightness.dark;
|
||||
return Scaffold(
|
||||
body: DecoratedBox(
|
||||
decoration: BoxDecoration(
|
||||
gradient: LinearGradient(
|
||||
begin: Alignment.topLeft,
|
||||
end: Alignment.bottomRight,
|
||||
colors: [
|
||||
colors.primary,
|
||||
colors.primaryContainer,
|
||||
colors.tertiary,
|
||||
],
|
||||
begin: Alignment.topCenter,
|
||||
end: Alignment.bottomCenter,
|
||||
colors: isDark
|
||||
? [
|
||||
colors.surface,
|
||||
colors.surfaceContainerLow,
|
||||
colors.surfaceContainer,
|
||||
]
|
||||
: [
|
||||
colors.surface,
|
||||
colors.surfaceContainerLow,
|
||||
const Color(0xFFE8DFD2),
|
||||
],
|
||||
),
|
||||
),
|
||||
child: SafeArea(
|
||||
@@ -82,31 +89,36 @@ class _SplashScreenState extends State<SplashScreen>
|
||||
child: Column(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
Container(
|
||||
width: 88,
|
||||
height: 88,
|
||||
decoration: BoxDecoration(
|
||||
color: colors.onPrimary.withValues(alpha: 0.16),
|
||||
borderRadius: BorderRadius.circular(24),
|
||||
),
|
||||
child: Icon(
|
||||
Icons.layers_rounded,
|
||||
size: 44,
|
||||
color: colors.onPrimary,
|
||||
ClipOval(
|
||||
child: Image.asset(
|
||||
'assets/images/emblem.png',
|
||||
width: 88,
|
||||
height: 88,
|
||||
fit: BoxFit.cover,
|
||||
errorBuilder: (_, _, _) => Container(
|
||||
width: 88,
|
||||
height: 88,
|
||||
color: colors.primaryContainer,
|
||||
child: const Icon(
|
||||
Icons.spa,
|
||||
size: 44,
|
||||
color: Colors.white,
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 24),
|
||||
Text(
|
||||
kAppName,
|
||||
style: textTheme.displaySmall?.copyWith(
|
||||
color: colors.onPrimary,
|
||||
color: colors.onSurface,
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 8),
|
||||
Text(
|
||||
'A Material 3 starter template',
|
||||
'Clarify what guides you',
|
||||
style: textTheme.bodyLarge?.copyWith(
|
||||
color: colors.onPrimary.withValues(alpha: 0.85),
|
||||
color: colors.onSurfaceVariant,
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 40),
|
||||
@@ -115,7 +127,7 @@ class _SplashScreenState extends State<SplashScreen>
|
||||
height: 28,
|
||||
child: CircularProgressIndicator(
|
||||
strokeWidth: 3,
|
||||
color: colors.onPrimary,
|
||||
color: colors.primary,
|
||||
),
|
||||
),
|
||||
],
|
||||
|
||||
@@ -0,0 +1,360 @@
|
||||
/// Welcome screen with stacked sample cards and guide drawer.
|
||||
library;
|
||||
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:provider/provider.dart';
|
||||
|
||||
import '../providers/values_sort_provider.dart';
|
||||
import '../utils/app_theme.dart';
|
||||
import '../widgets/practice_chrome.dart';
|
||||
|
||||
class WelcomeScreen extends StatelessWidget {
|
||||
const WelcomeScreen({super.key});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final text = Theme.of(context).textTheme;
|
||||
final colors = Theme.of(context).colorScheme;
|
||||
|
||||
return PracticeScaffold(
|
||||
header: const Padding(
|
||||
padding: EdgeInsets.fromLTRB(12, 0, 12, 0),
|
||||
child: BrandMark(),
|
||||
),
|
||||
footer: Column(
|
||||
children: [
|
||||
GhostPillButton(
|
||||
label: 'How this practice works',
|
||||
icon: Icons.info_outline,
|
||||
onPressed: () => _showGuide(context),
|
||||
),
|
||||
PrimaryPillButton(
|
||||
label: 'Begin Reflection',
|
||||
icon: Icons.arrow_forward,
|
||||
onPressed: () =>
|
||||
context.read<ValuesSortController>().beginPractice(),
|
||||
),
|
||||
],
|
||||
),
|
||||
child: ListView(
|
||||
children: [
|
||||
const SizedBox(height: 8),
|
||||
const _CardFan(),
|
||||
const SizedBox(height: 20),
|
||||
Text(
|
||||
'Discover what matters most to you',
|
||||
textAlign: TextAlign.center,
|
||||
style: text.displaySmall,
|
||||
),
|
||||
const SizedBox(height: 10),
|
||||
Text(
|
||||
'Through a gentle, guided card-sort practice, clarify your intrinsic '
|
||||
'values and illuminate the principles that guide your everyday decisions.',
|
||||
textAlign: TextAlign.center,
|
||||
style: text.bodyLarge?.copyWith(color: colors.onSurfaceVariant),
|
||||
),
|
||||
const SizedBox(height: 18),
|
||||
Wrap(
|
||||
alignment: WrapAlignment.center,
|
||||
crossAxisAlignment: WrapCrossAlignment.center,
|
||||
spacing: 8,
|
||||
runSpacing: 6,
|
||||
children: [
|
||||
_Meta(icon: Icons.schedule, label: '10–15 min'),
|
||||
Text('•', style: text.labelMedium),
|
||||
_Meta(icon: Icons.timelapse, label: 'Self-paced'),
|
||||
Text('•', style: text.labelMedium),
|
||||
_Meta(icon: Icons.lock_outline, label: 'Private & reflective'),
|
||||
],
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Future<void> _showGuide(BuildContext context) async {
|
||||
final controller = context.read<ValuesSortController>();
|
||||
await showModalBottomSheet<void>(
|
||||
context: context,
|
||||
isScrollControlled: true,
|
||||
builder: (ctx) {
|
||||
final text = Theme.of(ctx).textTheme;
|
||||
final colors = Theme.of(ctx).colorScheme;
|
||||
return Padding(
|
||||
padding: EdgeInsets.only(
|
||||
left: 24,
|
||||
right: 24,
|
||||
top: 8,
|
||||
bottom: MediaQuery.paddingOf(ctx).bottom + 24,
|
||||
),
|
||||
child: Column(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Row(
|
||||
children: [
|
||||
Icon(Icons.diversity_3, color: colors.tertiary),
|
||||
const SizedBox(width: 8),
|
||||
Expanded(
|
||||
child: Text(
|
||||
'The Practice of Sorting',
|
||||
style: text.titleLarge,
|
||||
),
|
||||
),
|
||||
IconButton(
|
||||
onPressed: () => Navigator.pop(ctx),
|
||||
icon: const Icon(Icons.close),
|
||||
),
|
||||
],
|
||||
),
|
||||
const SizedBox(height: 8),
|
||||
Text(
|
||||
'Grounded in contemplative psychology, this sorting practice '
|
||||
'helps clarify the core tenets that give your life meaning and direction.',
|
||||
style: text.bodyLarge?.copyWith(color: colors.onSurfaceVariant),
|
||||
),
|
||||
const SizedBox(height: 16),
|
||||
const _GuideStep(
|
||||
index: 1,
|
||||
title: 'One card at a time',
|
||||
body:
|
||||
'Review cards with diverse values one at a time, checking in with your intuition without overthinking.',
|
||||
),
|
||||
const _GuideStep(
|
||||
index: 2,
|
||||
title: 'Sort into reflective piles',
|
||||
body:
|
||||
'Place each card into Most, Very, Important, Somewhat, or Not Important — trusting your first honest response.',
|
||||
),
|
||||
const _GuideStep(
|
||||
index: 3,
|
||||
title: 'Distill your top values',
|
||||
body:
|
||||
'Narrow down to your core top values, then reflect so they can guide daily decisions with clarity.',
|
||||
),
|
||||
const SizedBox(height: 12),
|
||||
Container(
|
||||
padding: const EdgeInsets.all(14),
|
||||
decoration: BoxDecoration(
|
||||
color: AppTheme.surfaceContainerLow,
|
||||
borderRadius: BorderRadius.circular(16),
|
||||
border: Border.all(color: AppTheme.outlineVariant),
|
||||
),
|
||||
child: Row(
|
||||
children: [
|
||||
Icon(Icons.spa, color: colors.tertiary, size: 18),
|
||||
const SizedBox(width: 10),
|
||||
Expanded(
|
||||
child: Text(
|
||||
'There are no right or wrong answers—only your authentic presence.',
|
||||
style: text.bodyMedium?.copyWith(
|
||||
fontStyle: FontStyle.italic,
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 16),
|
||||
PrimaryPillButton(
|
||||
label: "Got it, let's begin",
|
||||
onPressed: () {
|
||||
Navigator.pop(ctx);
|
||||
controller.beginPractice();
|
||||
},
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
},
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class _Meta extends StatelessWidget {
|
||||
const _Meta({required this.icon, required this.label});
|
||||
|
||||
final IconData icon;
|
||||
final String label;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final colors = Theme.of(context).colorScheme;
|
||||
final text = Theme.of(context).textTheme;
|
||||
return Row(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
Icon(icon, size: 15, color: colors.tertiary),
|
||||
const SizedBox(width: 4),
|
||||
Text(label, style: text.labelMedium),
|
||||
],
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class _GuideStep extends StatelessWidget {
|
||||
const _GuideStep({
|
||||
required this.index,
|
||||
required this.title,
|
||||
required this.body,
|
||||
});
|
||||
|
||||
final int index;
|
||||
final String title;
|
||||
final String body;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final text = Theme.of(context).textTheme;
|
||||
final colors = Theme.of(context).colorScheme;
|
||||
return Padding(
|
||||
padding: const EdgeInsets.only(bottom: 14),
|
||||
child: Row(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
CircleAvatar(
|
||||
radius: 12,
|
||||
backgroundColor: AppTheme.surfaceContainerHigh,
|
||||
child: Text(
|
||||
'$index',
|
||||
style: text.labelMedium?.copyWith(
|
||||
color: colors.primary,
|
||||
fontWeight: FontWeight.w700,
|
||||
),
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 10),
|
||||
Expanded(
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(title, style: text.titleMedium),
|
||||
const SizedBox(height: 2),
|
||||
Text(body, style: text.bodyMedium),
|
||||
],
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class _CardFan extends StatelessWidget {
|
||||
const _CardFan();
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final text = Theme.of(context).textTheme;
|
||||
final colors = Theme.of(context).colorScheme;
|
||||
|
||||
Widget mini({
|
||||
required String domain,
|
||||
required String title,
|
||||
required String body,
|
||||
required double angle,
|
||||
required double dx,
|
||||
required double dy,
|
||||
bool hero = false,
|
||||
}) {
|
||||
return Transform.translate(
|
||||
offset: Offset(dx, dy),
|
||||
child: Transform.rotate(
|
||||
angle: angle,
|
||||
child: Container(
|
||||
width: hero ? 210 : 180,
|
||||
height: hero ? 155 : 135,
|
||||
padding: const EdgeInsets.all(14),
|
||||
decoration: BoxDecoration(
|
||||
color: hero ? Colors.white : AppTheme.surfaceContainer,
|
||||
borderRadius: BorderRadius.circular(20),
|
||||
border: Border.all(color: AppTheme.outlineVariant),
|
||||
boxShadow: [
|
||||
BoxShadow(
|
||||
color: const Color(0x142C2825),
|
||||
blurRadius: hero ? 16 : 8,
|
||||
offset: const Offset(0, 4),
|
||||
),
|
||||
],
|
||||
),
|
||||
child: ClipRect(
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Row(
|
||||
children: [
|
||||
Expanded(
|
||||
child: Text(
|
||||
domain.toUpperCase(),
|
||||
maxLines: 1,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
style: text.labelSmall?.copyWith(
|
||||
color: hero ? colors.secondary : colors.onSurfaceVariant,
|
||||
letterSpacing: 1.2,
|
||||
),
|
||||
),
|
||||
),
|
||||
if (hero)
|
||||
Icon(Icons.spa, size: 16, color: colors.primary),
|
||||
],
|
||||
),
|
||||
const SizedBox(height: 4),
|
||||
Text(
|
||||
title,
|
||||
maxLines: 1,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
style: (hero ? text.headlineMedium : text.titleLarge)
|
||||
?.copyWith(fontSize: hero ? 22 : 18, height: 1.1),
|
||||
),
|
||||
const SizedBox(height: 4),
|
||||
Expanded(
|
||||
child: Text(
|
||||
body,
|
||||
maxLines: 3,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
style: text.bodySmall,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
return SizedBox(
|
||||
height: 210,
|
||||
child: Stack(
|
||||
alignment: Alignment.center,
|
||||
children: [
|
||||
mini(
|
||||
domain: 'Experience',
|
||||
title: 'Adventure',
|
||||
body: 'To have new and exciting experiences.',
|
||||
angle: -0.21,
|
||||
dx: -48,
|
||||
dy: 10,
|
||||
),
|
||||
mini(
|
||||
domain: 'Relation',
|
||||
title: 'Compassion',
|
||||
body: 'To feel and act on concern for others.',
|
||||
angle: 0.21,
|
||||
dx: 48,
|
||||
dy: 8,
|
||||
),
|
||||
mini(
|
||||
domain: 'Core Ground',
|
||||
title: 'Genuineness',
|
||||
body: 'To act in a manner that is true to who I am.',
|
||||
angle: 0.02,
|
||||
dx: 0,
|
||||
dy: 4,
|
||||
hero: true,
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user