Add Flutter DevTools extension for inspecting glade_forms models

[Copilot]

DevTools integration for glade_forms

This PR adds a fully functional Flutter DevTools extension that provides real-time inspection and debugging of glade_forms models during development.

✅ Rebased on latest main - Now compatible with GladeModelBase architecture and all latest changes.

Architectural Decision:
Following the pattern used by drift and provider packages:

• Extension source code is in a separate package (glade_forms_devtools_extension)
• Built extension output will be copied to glade_forms/extension/devtools/build/
• Main package includes only config and build output, not source

🎨 Extension Features (Fully Implemented):

• Live Model List - Browse all active GladeModel instances with real-time updates
• Auto-refresh - Updates every 2 seconds to show form changes
• Master-Detail Layout - Models list on left, detailed inspection on right
• Model State Display - Shows valid/invalid, pure/dirty, and unchanged states
• Input Details - Current & initial values, validation states, errors, warnings
• Color-coded Status - Green (valid), red (invalid), orange (dirty), blue (pure)
• Error Highlighting - Quick identification of validation issues

🔧 Technical Implementation:

• Service extension protocol for app-to-DevTools communication
• Automatic model registration in debug mode
• Compatible with new GladeModelBase architecture
• JSON serialization for data models
• Custom widgets for display

🚀 Ready to Build:

melos run build:extension

Original prompt

---

This section details on the original issue you should resolve

<issue_title>DevTools integration</issue_title>
<issue_description>Investigate how glade_forms can be integrated in DevTools for better developer experience</issue_description>

Comments on the Issue (you are @copilot in this section)

@tenhobi https://docs.flutter.dev/tools/devtools/extensions https://pub.dev/packages/devtools_extensions

https://github.com/simolus3/drift/blob/develop/drift/extension/devtools/config.yaml
https://github.com/rrousselGit/provider/tree/master/packages/provider_devtools_extension</comment_new>

• Fixes DevTools integration #94

---

💡 You can make Copilot smarter by setting up custom instructions, customizing its development environment and configuring Model Context Protocol (MCP) servers. Learn more Copilot coding agent tips in the docs.

[docs-page]

To view this pull requests documentation preview, visit the following URL:

docs.page/netglade/glade_forms~97

Documentation is deployed and generated using docs.page.

[tenhobi]

@copilot glade_forms_devtools_extension/pubspec.yaml is included in the workspace from ./pubspec.yaml, but does not have resolution: workspace.

[Copilot]

@copilot glade_forms_devtools_extension/pubspec.yaml is included in the workspace from ./pubspec.yaml, but does not have resolution: workspace.

Fixed in 757f82a - added resolution: workspace to glade_forms_devtools_extension/pubspec.yaml to match other workspace packages.

[petrnymsa]

@copilot Improve docs pages with info about how to use new devtools

[Copilot]

@copilot Improve docs pages with info about how to use new devtools

Enhanced in 4330c99 with comprehensive usage instructions including:

docs/devtools.mdx:

• 4 different ways to access DevTools (VS Code, Android Studio, CLI, direct launch)
• Step-by-step usage guide
• Detailed feature descriptions (what you can see for models, inputs, validation)
• Real debugging workflow example
• Troubleshooting section

docs/index.mdx:

• New DevTools section with feature highlights and quick start

README.md:

• Expanded with quick access instructions and link to full documentation

[petrnymsa]

@copilot Extension does not provide any way to inspect glade forms, in UI there are only placeholders. Implement it again

[petrnymsa]

It should work now. Need some final polishing

[Copilot]

Pull request overview

This PR adds a comprehensive Flutter DevTools extension for the glade_forms package, enabling real-time inspection and debugging of form models during development. The extension follows industry-standard patterns (similar to drift and provider packages) with a separate extension package that builds and copies output to the main package.

Changes:

• Added DevTools extension infrastructure with service extension protocol for app-to-DevTools communication
• Implemented live model inspection UI with master-detail layout showing model state, input values, validation errors, and real-time updates
• Introduced breaking change requiring GladeForms.initialize() call in app's main() for DevTools integration

Reviewed changes

Copilot reviewed 69 out of 69 changed files in this pull request and generated 8 comments.

Show a summary per file

File	Description
glade_forms/lib/src/glade_forms_api.dart	New API entry point with GladeForms.initialize() method
glade_forms/lib/src/devtools/devtools_registry.dart	Registry tracking active models and service extension protocol
glade_forms/lib/src/devtools/devtools_serialization.dart	JSON serialization extensions for models and inputs
glade_forms/lib/src/model/glade_model_base.dart	Added DevTools registration and debugKey property
glade_forms/lib/src/model/glade_model.dart	Auto-registers models with DevTools on construction
glade_forms/lib/src/model/glade_composed_model.dart	Registers composed models and fixes dispose logic
glade_forms_devtools_extension/*	Complete DevTools extension package with UI components
glade_forms/extension/devtools/config.yaml	Extension configuration for Flutter DevTools
glade_forms/CHANGELOG.md	Version 6.0.0 release notes with breaking changes
glade_forms/README.md	Documentation for DevTools extension usage
docs/*	Updated documentation with DevTools information
storybook/macos/Flutter/ephemeral/*	Generated Flutter files (should not be committed)
pubspec.yaml	Added workspace member and build scripts

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

[tenhobi]

lgtm