ui_commenter 0.1.1

ui_commenter: ^0.1.1 copied to clipboard

example/lib/main.dart

import 'package:flutter/material.dart';
// ui_commenter is a debug-only dev_dependency wired into lib/ here on purpose.
// ignore: depend_on_referenced_packages
import 'package:ui_commenter/ui_commenter.dart';

void main() => runApp(const ExampleApp());

class ExampleApp extends StatelessWidget {
  const ExampleApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'UI Commenter Example',
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.indigo),
        useMaterial3: true,
      ),
      // The one required host-app change: wrap the app subtree once. The
      // commenter sits above the app's Navigator/Overlay and can highlight
      // anything beneath it. It is a no-op in release/profile builds.
      builder: (context, child) => UiCommenter(
        config: const UiCommenterConfig(
          appName: 'UI Commenter example app',
          brightness: .dark,
        ),
        child: child!,
      ),
      home: const HomePage(),
    );
  }
}

class HomePage extends StatefulWidget {
  const HomePage({super.key});

  @override
  State<HomePage> createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  int _count = 0;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('UI Commenter')),
      body: ListView(
        padding: const EdgeInsets.all(16),
        children: [
          const Text(
            'Arm select mode (tap the FAB), then tap any widget below to '
            'comment on it. Each tap adds a comment; Copy Prompt bundles them '
            'all for your coding agent.',
          ),
          const SizedBox(height: 24),
          Card(
            child: Padding(
              padding: const EdgeInsets.all(16),
              child: Column(
                mainAxisSize: MainAxisSize.min,
                children: [
                  Text(
                    'Count: $_count',
                    style: Theme.of(context).textTheme.headlineSmall,
                  ),
                  const SizedBox(height: 12),
                  ElevatedButton(
                    key: const ValueKey('increment'),
                    onPressed: () => setState(() => _count++),
                    child: const Text('Increment'),
                  ),
                ],
              ),
            ),
          ),
          const SizedBox(height: 16),
          const Card(
            child: ListTile(
              key: ValueKey('profile-tile'),
              leading: Icon(Icons.person),
              title: Text('Profile'),
              subtitle: Text('Tap to edit your details'),
              trailing: Icon(Icons.chevron_right),
            ),
          ),
          const SizedBox(height: 16),
          Wrap(
            spacing: 8,
            children: const [
              Chip(label: Text('Flutter')),
              Chip(label: Text('Dart')),
              Chip(label: Text('Widgets')),
            ],
          ),
          const SizedBox(height: 16),
          Row(
            mainAxisAlignment: MainAxisAlignment.spaceEvenly,
            children: const [
              Icon(Icons.favorite, color: Colors.red, size: 32),
              Icon(Icons.star, color: Colors.amber, size: 32),
              Icon(Icons.bolt, color: Colors.blue, size: 32),
            ],
          ),
        ],
      ),
    );
  }
}