genui-helper

Esta habilidad proporciona flujos de trabajo y mejores prácticas específicas del repositorio genui.

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.

Más skills de flutter

dart-modern-features
flutter
Para encontrar candidatos para la modernización:
flutter-fix-layout-issues
flutter
Corrige errores de diseño en Flutter (desbordamientos, restricciones ilimitadas) usando herramientas Dart y Flutter MCP. Úsalo al abordar "RenderFlex overflowed", "Vertical…
adding-release-notes
flutter
Añade descripciones de cambios visibles para el usuario a las notas de la versión de DevTools. Úsalo al documentar mejoras, correcciones o nuevas funciones en el archivo NEXT_RELEASE_NOTES.md.
reviewing-devtools-prs
flutter
Flujo de trabajo de revisión de PR específico del repositorio de DevTools que aplica las guías de estilo de DevTools y los patrones de revisión comunes. Úsalo al revisar solicitudes de extracción en el…
dart-use-primary-constructors
flutter
Ayuda a los usuarios a escribir constructores primarios sintáctica y semánticamente correctos en Dart, y a migrar/utilizar la nueva sintaxis de constructor, la sintaxis de punto y coma de cuerpo vacío,…
code-documentation
flutter
Guía para escribir documentación de código efectiva, que incluye docstrings, JSDoc, dartdoc y comentarios de implementación. Usa esta habilidad al escribir código nuevo, agregar…
api-review
flutter
Revisa el código especificado conforme a las pautas canónicas de diseño de API. Usa esta habilidad cuando el usuario solicite una revisión de API o quiera verificar el código según las pautas de diseño de API…
flutter-accessibility
flutter
Implementa los estándares de accesibilidad WCAG 2 y EN 301 549 y diseños adaptativos en aplicaciones Flutter. Aplica anotaciones semánticas, tamaños de destino táctil (mínimo 48x48 dp) y relaciones de contraste de texto (4.5:1 para texto pequeño, 3:1 para texto grande) en plataformas móviles, web y de escritorio. Proporciona lógica de decisión para la inicialización de semántica web, envoltura de widgets interactivos, cambio de diseño basado en tamaño de pantalla y manejo de entrada por teclado/ratón. Incluye gestión de enfoque de navegación mediante FocusTraversalGroup y...