genui-helper

Diese Fähigkeit bietet Arbeitsabläufe und bewährte Methoden, die spezifisch für das genui-Repository sind.

npx skills add https://github.com/flutter/genui --skill genui-helper

GenUI Development Helper

This skill provides workflows and best practices specific to the genui repository.

Workflows

1. Running Tests and Fixes

The repository uses a custom tool to run tests, apply fixes, and format code before committing. It should typically only be run before committing, since it is inefficient and slow to run it on every change.

It will run dart fix --apply, dart format, and flutter test on all packages in the repository.

Command:

dart run tool/test_and_fix/bin/test_and_fix.dart

When to use:

  • Before committing changes, to ensure project health.
  • Instead of running flutter test manually for each project in the repo.

2. Creating a New Component in the genui package

When creating a new UI component in genui:

  1. Location: Place component files in packages/genui/lib/src/components/.
  2. Inheritance: Components must extend UiComponent.
  3. A2UI Compliance: Ensure the component matches the A2UI specification.
  4. Documentation: Follow strict Dart documentation standards.

3. Updating Documentation

  • Documentation source of truth is in docs/.
  • Use mkdocs context if mentioned, but primarily edit the markdown files directly.
  • Ensure strict adherence to "Natural Writing" standards (no AI-isms).

Key Constants & Patterns

  • Current A2UI Version: v0.9
  • State Management: Uses SurfaceController from genui.

References

Code visibility

Make every code element as private as it can be. If tests need access, use the language's test-visibility mechanism instead of making it public. For example, in Dart, keep the _ prefix and annotate with @visibleForTesting.

Mehr Skills von flutter

dart-modern-features
flutter
Um Kandidaten für die Modernisierung zu finden:
flutter-fix-layout-issues
flutter
Behebt Flutter-Layout-Fehler (Überläufe, unbegrenzte Constraints) mit Dart und Flutter MCP Tools. Verwenden bei der Behebung von "RenderFlex overflowed", "Vertical…
adding-release-notes
flutter
Fügt benutzerseitige Änderungsbeschreibungen zu den DevTools-Versionshinweisen hinzu. Verwenden Sie dies, wenn Sie Verbesserungen, Fehlerbehebungen oder neue Funktionen in der Datei NEXT_RELEASE_NOTES.md dokumentieren.
reviewing-devtools-prs
flutter
DevTools-repositoriumspezifischer PR-Review-Workflow, der die DevTools-Stilrichtlinien und gängige Review-Muster durchsetzt. Verwenden Sie dies beim Überprüfen von Pull Requests im…
dart-use-primary-constructors
flutter
Helfen Sie Benutzern, syntaktisch und semantisch korrekte primäre Konstruktoren in Dart zu schreiben, und migrieren/verwenden Sie die neue Konstruktorsyntax, die Semikolon-Syntax mit leerem Körper, …
code-documentation
flutter
Leitfaden für das Schreiben effektiver Code-Dokumentation, einschließlich Docstrings, JSDoc, dartdoc und Implementierungskommentaren. Verwenden Sie diese Fähigkeit beim Schreiben von neuem Code, beim Hinzufügen…
api-review
flutter
Überprüft den angegebenen Code gegen die kanonischen API-Design-Richtlinien. Verwenden Sie dieses Skill, wenn der Benutzer eine API-Überprüfung anfordert oder Code gegen API-Design…
flutter-accessibility
flutter
Implementiert WCAG 2- und EN 301 549-Barrierefreiheitsstandards sowie adaptive Layouts in Flutter-Apps. Erzwingt semantische Annotationen, Mindestgrößen für Antippziele (48x48 dp) und Textkontrastverhältnisse (4,5:1 für kleinen Text, 3:1 für großen Text) auf mobilen, Web- und Desktop-Plattformen. Bietet Entscheidungslogik für die Initialisierung von Websemantik, das Umschließen interaktiver Widgets, bildschirmgrößenbasiertes Layout-Switching sowie Tastatur-/Mauseingabe-Handling. Enthält Fokus-Traversal-Management über FocusTraversalGroup und...